123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656 |
- <template>
- <div class="startFrom">
- <el-dialog title="考评修订详情" v-model="dialogVisible" :fullscreen="true" :close-on-click-modal="false">
- <div class="startDetail">
- <p class="starttitleSty">单据信息:</p>
- <el-row class="danjuMsg">
- <el-col :span="6">
- <div class="danjuMsg_data">
- <span class="data_tit">业务编号:</span>
- <span>{{receiptMsg.code}}</span>
- </div>
- <div class="danjuMsg_data">
- <span class="data_tit">创建日期:</span>
- <span>{{receiptMsg.createDate}}</span>
- </div>
- </el-col>
- <el-col :span="6">
- <div class="danjuMsg_data">
- <span class="data_tit">业务简述:</span>
- <span>{{receiptMsg.des}}</span>
- </div>
- <div class="danjuMsg_data">
- <span class="data_tit">考评周期:</span>
- <span>{{receiptMsg.type}}</span>
- </div>
- </el-col>
- <el-col :span="6">
- <div class="danjuMsg_data">
- <span class="data_tit">流程状态:</span>
- <span>{{receiptMsg.stage}}</span>
- </div>
- <div class="danjuMsg_data">
- <span class="data_tit">年度:</span>
- <span>{{receiptMsg.year}}</span>
- </div>
- </el-col>
- <el-col :span="6">
- <div class="danjuMsg_data">
- <span class="data_tit">创建人:</span>
- <span>{{receiptMsg.createName}}</span>
- </div>
- <div class="danjuMsg_data">
- <span class="data_tit">单据状态:</span>
- <span>{{receiptMsg.recStage}}</span>
- </div>
- </el-col>
- </el-row>
- <div class="detaTableBtns">
- <div class="tableBtn add" @click="addTableDetail">
- <img :src="addIcon" alt="">
- <span>修订</span>
- </div>
- <div class="tableBtn save" @click="saveDetail">
- <img :src="saveIcon" alt="">
- <span>保存</span>
- </div>
- <div class="tableBtn import" @click="handleImport">
- <img :src="importIcon" alt="">
- <span>导入</span>
- </div>
- <div class="tableBtn export" @click="handleExport">
- <img :src="exportIcon" alt="">
- <span>导出</span>
- </div>
- </div>
- <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
- <el-tab-pane label="考评指标项内容" name="first">
- <el-table :data="quantifiedList.slice((pageLeft.currentPage-1)*pageLeft.pagesize, pageLeft.currentPage*pageLeft.pagesize)" style="width: 100%" @select="rowClick" @select-all="rowClick">
- <el-table-column type="selection" label="操作" align="center"></el-table-column>
- <el-table-column type="index" label="序号" width="80" />
- <el-table-column label="单位名称" prop="organizationName" width="300" />
- <el-table-column label="指标分类" prop="typeName" />
- <el-table-column label="业务阶段" prop="stageName" />
- <el-table-column label="业务属性" prop="sectionName" />
- <el-table-column label="指标名称" prop="indicatorName" />
- <el-table-column label="填报部门" prop="deptName" width="260" />
- <el-table-column label="目标值">
- <template #default="scope">
- <el-input-number v-model="scope.row.quantifiedValue"
- :precision="2" :step="0.1" />
- </template>
- </el-table-column>
- <el-table-column label="单位" prop="unit" />
- <el-table-column label="审核状态">
- <template #default="scope">
- <el-select v-model="scope.row.state" placeholder="请选择审核状态">
- <el-option
- v-for="item in statusData"
- :key="item.id"
- :label="item.name"
- :value="item.id">
- </el-option>
- </el-select>
- </template>
- </el-table-column>
- </el-table>
- <el-pagination
- @current-change="handleCurrentChangeLeft"
- :current-page="pageLeft.currentPage"
- :page-size="pageLeft.pagesize"
- layout="total, prev, pager, next, jumper"
- :total="pageLeft.total">
- </el-pagination>
- </el-tab-pane>
- <el-tab-pane label="考评评价指标内容" name="second">
- <el-table :data="nonQuantifiedList.slice((pageRight.currentPage-1)*pageRight.pagesize, pageRight.currentPage*pageRight.pagesize)" style="width: 100%">
- <el-table-column type="index" label="序号" width="80" />
- <el-table-column label="单位名称" prop="organizationName" width="300" />
- <el-table-column label="指标分类" prop="typeName" />
- <el-table-column label="业务阶段" prop="stageName" />
- <el-table-column label="业务属性" prop="sectionName" />
- <el-table-column label="指标名称" prop="childName" />
- <el-table-column label="填报部门" prop="deptName" width="260" />
- <el-table-column label="值">
- <template #default="scope">
- <el-input v-model="scope.row.nonQuantifiedValue" />
- </template>
- </el-table-column>
- <el-table-column label="审核状态">
- <template #default="scope">
- <el-select v-model="scope.row.state" placeholder="请选择审核状态">
- <el-option
- v-for="item in statusData"
- :key="item.id"
- :label="item.name"
- :value="item.id">
- </el-option>
- </el-select>
- </template>
- </el-table-column>
- </el-table>
- <el-pagination
- @current-change="handleCurrentChangeRight"
- :current-page="pageRight.currentPage"
- :page-size="pageRight.pagesize"
- layout="total, prev, pager, next, jumper"
- :total="pageRight.total">
- </el-pagination>
- </el-tab-pane>
- </el-tabs>
- </div>
- <template #footer>
- <span class="dialog-footer">
- <el-button type="primary" @click="dialogVisible = false">取 消</el-button>
- </span>
- </template>
- </el-dialog>
- <el-dialog title="修订数据" v-model="revisionVisible" width="70vw" custom-class="revisionClass" :close-on-click-modal="false">
- <div class="revisionSty">
- <el-table :data="revisionData" style="width: 100%" @select="revisionClick" @select-all="revisionClick">
- <el-table-column type="selection" label="操作" align="center"></el-table-column>
- <el-table-column label="单位名称" prop="organizationName" />
- <el-table-column label="指标分类" prop="typeName" />
- <el-table-column label="业务阶段" prop="stageName" />
- <el-table-column label="业务属性" prop="sectionName" />
- <el-table-column label="指标名称" prop="indicatorName" />
- <el-table-column label="填报部门" prop="deptName" />
- <el-table-column label="目标值" prop="quantifiedValue" v-if="activeName === 'first'" />
- <el-table-column label="值" prop="nonquantifiedValue" v-if="activeName !== 'first'" />
- <el-table-column label="单位" prop="unit" v-if="activeName === 'first'" />
- <el-table-column label="审核状态" prop="state" />
- </el-table>
- </div>
- <template #footer>
- <span class="dialog-footer">
- <el-button type="primary" @click="revisionOk">确 认</el-button>
- </span>
- </template>
- </el-dialog>
- <import-dailog ref="importPage" @successImport="successImport" @importLoading="importLoading"></import-dailog>
- </div>
- </template>
- <script>
- import importDailog from '../importPage/importDailog.vue'
- import {apiGetevaluationrevisionDetails,apiPostevaluationrevisionSave, apiPostIsdoAction,
- apiGetevaluationrevisionPopUpData} from '../../api/api'
- import ExcelJS from 'exceljs'
- import fileSave from 'file-saver'
- import addIcon from '../../assets/btnIcon/add.png'
- import saveIcon from '../../assets/btnIcon/save.png'
- import editIcon from '../../assets/btnIcon/edit.png'
- import deleteIcon from '../../assets/btnIcon/delete.png'
- import exportIcon from '../../assets/btnIcon/export.png'
- import importIcon from '../../assets/btnIcon/import.png'
- export default {
- components: {
- importDailog
- },
- data() {
- return {
- dialogVisible: false,
- revisionVisible: false,
- revisionData: [],
- activeName: 'first',
- quantifiedList: [],
- nonQuantifiedList: [],
- changeDateSelect: [],
- revisioDataSelect: [],
- receiptMsg: {
- code: '',
- des: '',
- stage: '',
- createName: '',
- createDate: '',
- type: '',
- year: '',
- recStage: ''
- },
- addIcon: addIcon,
- saveIcon: saveIcon,
- editIcon: editIcon,
- deleteIcon: deleteIcon,
- exportIcon: exportIcon,
- importIcon: importIcon,
- rowMsg: {},
- indicItemoptions: [],
- statusData: [],
- pageLeft:{
- pagesize: 15,
- currentPage: 1,
- total: 0
- },
- pageRight:{
- pagesize: 15,
- currentPage: 1,
- total: 0
- },
- }
- },
- created() {
- this.statusData = [
- {
- name: '已完成',
- id: '1'
- },
- {
- name: '待审核',
- id: '0'
- },
- {
- name: '未开始',
- id: '-1'
- }
- ]
- },
- methods: {
- init(row) {
- this.dialogVisible = true
- this.activeName = 'first'
- this.receiptMsg = {
- code: row.responsibilityCode,
- des: row.des,
- stage: row.stage,
- createName: row.createName,
- createDate: row.createTime,
- type: row.checkCycle === 'YDKP'?'月度考评':row.checkCycle === 'JDKP'?'季度考评':'年度考评',
- year: row.year,
- recStage: '有效'
- }
- this.getDetails(row.deptResponsibilityId)
- this.rowMsg = row
- },
- handleClick() {
- this.changeDateSelect = []
- },
- rowClick(selection, row) {
- this.changeDateSelect = selection
- },
- revisionClick(selection, row) {
- this.revisioDataSelect = selection
- },
- revisionOk() {
- this.revisionVisible = false
- if (this.activeName === 'first') {
- this.quantifiedList = this.quantifiedList.length>0?this.quantifiedList:[]
- this.quantifiedList = this.quantifiedList.concat(this.revisioDataSelect)
- } else {
- this.nonQuantifiedList = this.nonQuantifiedList.length>0?this.nonQuantifiedList:[]
- this.nonQuantifiedList = this.nonQuantifiedList.concat(this.revisioDataSelect)
- }
- },
- handleCurrentChangeLeft(val) {
- this.pageLeft.currentPage = val
- },
- handleCurrentChangeRight(val) {
- this.pageRight.currentPage = val
- },
- //获取详情
- getDetails(id) {
- let that = this
- that.quantifiedList = []
- that.nonQuantifiedList = []
- apiGetevaluationrevisionDetails(id).then(datas =>{
- if (datas && datas.data) {
- that.quantifiedList = datas.data.quantifiedList
- that.pageLeft.total = datas.data.quantifiedList.length
- if (datas.data.nonQuantifiedList.length>0) {
- datas.data.nonQuantifiedList.forEach(it =>{
- it.childName = it.indicatorName //指标id
- // nonarr.push(obj)
- })
- }
- that.nonQuantifiedList = datas.data.nonQuantifiedList.length>0?datas.data.nonQuantifiedList:[]
- that.pageRight.total = datas.data.nonQuantifiedList.length
- }
- })
- },
- addTableDetail() {
- this.revisionVisible = true
- this.getrevisionDataFn(this.rowMsg)
- // let obj = {
- // showInput: true,
- // stageName: '',
- // sectionName: '',
- // organizationName: '',
- // deptName: '',
- // typeName: '',
- // optionName: '',
- // nonQuantifiedValue: ''
- // }
- // this.nonQuantifiedList.unshift(obj)
- },
- // 修订数据
- getrevisionDataFn(row) {
- let that = this
- that.revisionData = []
- let params = {
- deptResponsibilityId: row.deptResponsibilityId,
- isQuantified: this.activeName === 'first'?'是':'否'
- }
- apiGetevaluationrevisionPopUpData(params).then(datas =>{
- if (datas && datas.data) {
- that.revisionData = datas.data
- }
- })
- },
- saveDetail() {
- let that = this
- let params = []
- if (that.activeName === 'first') {
- that.quantifiedList.forEach(item =>{
- let obj = {
- id: item.id,
- isQuantified: '是',
- quantifiedValue: item.quantifiedValue,
- state: item.state
- }
- params.push(obj)
- })
- } else {
- that.nonQuantifiedList.forEach(item =>{
- let obj = {
- id: item.id,
- isQuantified: '否',
- quantifiedValue: 0.0,
- nonQuantifiedValue: item.nonQuantifiedValue,
- state: item.state
- }
- params.push(obj)
- })
- }
- apiPostevaluationrevisionSave(params).then(datas =>{
- if (datas) {
- if (datas.success) {
- that.$message({
- message: '保存成功',
- type: 'success'
- });
- that.getDetails(that.rowMsg.deptResponsibilityId)
- } else {
- that.$message({
- message: datas.data,
- type: 'error'
- })
- }
- }
- })
- },
- examineAndApprove(type) {
- let that = this
- let actionCS = ''
- if (type === 'agree') {
- if (that.rowMsg.taskType === 'SIGN') {
- actionCS = 'signAgree'
- } else if (that.rowMsg.taskType === 'NORMAL') {
- actionCS = 'agree'
- }
- } else {
- if (that.rowMsg.taskType === 'SIGN') {
- actionCS = 'signReject'
- } else if (that.rowMsg.taskType === 'NORMAL') {
- actionCS = 'reject'
- }
- }
- let params = {
- taskId: that.rowMsg.id, //任务ID
- nodeId: that.rowMsg.nodeId, //节点ID
- action: actionCS, //固定值
- instanceId: that.rowMsg.instId, //流程实例ID
- opinion: that.descMsg, //审批意见
- iamCode: window.localStorage.getItem('code'), //认证后code值
- taskName: that.rowMsg.name,
- defKey: that.instanceChild.defKey,
- bizKey: that.instanceChild.bizKey
- }
- apiPostIsdoAction(params).then(datas =>{
- if (datas && datas.data) {
- if (datas.data.isOk) {
- that.$message({
- message: datas.data.data,
- type: 'success'
- })
- that.dialogVisible = false
- that.$emit('approveMsg', datas.data.isOk)
- } else {
- that.$message({
- message: datas.data.msg,
- type: 'error'
- })
- }
- }
- })
- },
- handleImport() {
- this.$refs.importPage.upload.title = "考评修订信息导入"
- this.$refs.importPage.upload.open = true
- this.$refs.importPage.upload.data = {
- isQuantified: this.activeName === 'first'?'是':'否'
- }
- this.$refs.importPage.upload.url = `/evaluation-revision/import`
- },
- successImport(val) {
- this.getDetails(this.rowMsg.deptResponsibilityId)
- },
- handleExport() {
- let data = [] //接口返回数据
- const workbook = new ExcelJS.Workbook()
- const worksheet = workbook.addWorksheet('Sheet1')
- //根据数据自己调整
- let colums = []
- colums = [
- { header: 'ID', key: 'id', width: 26 },
- { header: '单位名称', key: 'organizationName', width: 26 },
- { header: '指标分类', key: 'typeName', width: 18 },
- { header: '业务阶段', key: 'stageName', width: 18 },
- { header: '业务属性', key: 'sectionName', width: 18 },
- { header: '指标名称', key: 'childName', width: 18 },
- { header: '填报部门', key: 'deptName', width: 26 },
- ]
- if (this.activeName === 'first') {
- colums.push(
- { header: '目标值', key: 'quantifiedValue', width: 18 },
- { header: '单位', key: 'unit', width: 18 },
- { header: '审核状态', key: 'state', width: 18 }
- )
- this.quantifiedList.forEach(item =>{
- data.push(item)
- })
- } else {
- colums.push(
- { header: '值', key: 'nonQuantifiedValue', width: 18 },
- { header: '审核状态', key: 'state', width: 18 }
- )
- this.nonQuantifiedList.forEach(item =>{
- data.push(item)
- })
- }
- worksheet.columns = colums
- worksheet.getRow(1).font = {
- size: 12,
- bold: true
- }
- worksheet.addRows(data)
- workbook.xlsx.writeBuffer().then(buffer => {
- //这里为type
- const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8' })
- fileSave(blob, `数据导出.xlsx`)
- })
- },
- }
- }
- </script>
- <style lang="less">
- .startFrom{
- .el-overlay{
- .el-dialog{
- // margin-top: 7vh;
- .el-dialog__body{
- padding: 0 20px !important;
- .startDetail{
- .starttitleSty{
- font-size: 18px;
- font-family: Microsoft YaHei;
- font-weight: bold;
- color: #3B7AD1;
- // line-height: 12px;
- margin: 20px 0 20px 10px;
- }
- .danjuMsg{
- border: 1px solid #D6DBEA;
- padding: 10px 20px;
- border-radius: 10px;
- margin-bottom: 20px;
- .danjuMsg_data{
- padding: 5px 0 10px 0;
- .data_tit{
- margin-right: 10px;
- font-weight: bold;
- font-size: 14px;
- font-family: Microsoft YaHei;
- color: #8991B0;
- }
- .data_tit_wd{
- display: inline-block;
- width: 90px;
- }
- .el-form-item--small{
- .el-input{
- height: 25px;
- width: 160px;
- }
- margin-bottom: 0;
- .el-input-number{
- height: 25px;
- .el-input-number__decrease, .el-input-number__increase{
- right: -39px;
- }
- }
- }
- }
- }
- .el-select, .el-input{
- width: 100%;
- }
- .detaTableBtns{
- display: flex;
- width: 340px;
- position: relative;
- top: 32px;
- left: 80vw;
- z-index: 11111;
- .tableBtn {
- display: flex;
- margin-right: 30px;
- width: 13%;
- img{
- margin-right: 5px;
- margin-top: 1px;
- }
- span{
- font-size: 14px;
- font-family: Microsoft YaHei;
- font-weight: 400;
- }
- }
- .add{
- cursor: pointer;
- span{
- color: #3B7AD1;
- }
- }
- .save{
- cursor: pointer;
- span{
- color: #50C14E;
- }
- }
- .edit{
- span{
- color: #F5A623;
- }
- }
- .delete{
- cursor: no-drop;
- span{
- color: #F65177;
- }
- }
- .export{
- cursor: pointer;
- span{
- color: #2baa8a;
- }
- }
- .import{
- cursor: pointer;
- span{
- color: #ce1e78;
- }
- }
- }
- .el-tabs{
- .el-tabs__header{
- .el-tabs__nav{
- .el-tabs__item{
- font-size: 18px;
- font-family: Microsoft YaHei;
- font-weight: bold;
- margin: 0 10px;
- color: #8991B0;
- }
- .is-active{
- font-size: 18px;
- font-family: Microsoft YaHei;
- font-weight: bold;
- color: #3B7AD1;
- margin: 0 10px;
- }
- }
- }
-
- .el-table{
- margin-bottom: 10px;
- .el-table__body-wrapper{
- height: 50vh;
- }
- .el-table__row{
- .cell{
- .el-input{
- height: 24px;
- .el-input__inner{
- height: 24px;
- }
- }
- }
- }
- }
- }
- }
- }
- .el-dialog__footer{
- .dialog-footer{
- display: flex;
- justify-content: center;
- .el-button{
- width: 180px !important;
- height: 40px !important;
- }
- }
- }
- }
- }
- .revisionClass{
- margin-top: 7vh;
- .el-table{
- margin-bottom: 10px;
- .el-table__body-wrapper{
- height: 50vh;
- }
- }
- }
- }
- </style>
|