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.
1200 lines
35 KiB
1200 lines
35 KiB
<template> |
|
<basic-container> |
|
<!-- 首页表格 --> |
|
<div class="avue-crud content_max"> |
|
<!-- 搜索模块 --> |
|
<div v-h5uShow="search" class="el_header_top"> |
|
<!-- 查询模块 --> |
|
<el-form :inline="true" :model="searchFrom" class="header_search"> |
|
<!-- 查询按钮 --> |
|
<el-form-item label="考核部门："> |
|
<el-tree-select |
|
v-model="searchFrom.assessDept" |
|
:data="AssessmentDepartment" |
|
check-strictly |
|
:render-after-expand="false" |
|
style="width: 240px" |
|
@node-click="searcheNodeClick" |
|
clearable |
|
@change="assessDeptChange" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="归属部门"> |
|
<el-tree-select |
|
v-model="searchFrom.createDeptName" |
|
:data="AssessmentDepartment" |
|
check-strictly |
|
:render-after-expand="false" |
|
style="width: 240px" |
|
@node-click="BelongsearcheNodeClick" |
|
clearable |
|
@change="Belongingdepartment" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="指标类型："> |
|
<el-select |
|
v-model="searchFrom.classifyId" |
|
class="m-2" |
|
placeholder="请选择指标类型" |
|
style="width: 240px" |
|
@change="Indicatortype" |
|
clearable |
|
> |
|
<el-option |
|
v-for="item in classificationoptions" |
|
:key="item.id" |
|
:label="item.name" |
|
:value="item.id" |
|
/> |
|
</el-select> |
|
</el-form-item> |
|
|
|
<el-form-item label="考评时间："> |
|
<el-date-picker |
|
v-model="searchFrom.createTime" |
|
type="daterange" |
|
range-separator="至" |
|
start-placeholder="开始日期" |
|
end-placeholder="结束日期" |
|
format="YYYY-MM-DD" |
|
value-format="YYYY-MM-DD" |
|
:size="size" |
|
@change="timeChange" |
|
clearable |
|
/> |
|
</el-form-item> |
|
<el-form-item class="el-btn"> |
|
<el-button type="primary" icon="el-icon-search" @click="searchChange">查询</el-button> |
|
<!-- <el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button> --> |
|
</el-form-item> |
|
</el-form> |
|
</div> |
|
|
|
<!-- 控件模块 --> |
|
<el-row> |
|
<div class="avue-crud__header"> |
|
<!-- 头部左侧按钮模块 --> |
|
<div class="avue-crud__left"> |
|
<el-button type="primary" @click="BatchDelete" icon="Delete"> 批量删除</el-button> |
|
<el-button type="primary" @click="exportList" |
|
><el-icon><Download /></el-icon>导出</el-button |
|
> |
|
</div> |
|
<!-- 头部右侧按钮模块 --> |
|
<div class="avue-crud__right"> |
|
<el-button icon="el-icon-refresh" @click="searchChangeS" circle></el-button> |
|
<el-button icon="Operation" @click="showdrawer(true)" circle></el-button> |
|
<el-button icon="Search" @click="searchHide" circle></el-button> |
|
</div> |
|
</div> |
|
</el-row> |
|
|
|
<!-- 首页表格 --> |
|
<el-row> |
|
<!-- 列表模块 --> |
|
<tablecmt |
|
ref="tableNode" |
|
:columnList="IndicatorColumnList" |
|
:tableData="classificationdata" |
|
:loading="loadingclassification" |
|
@inputTxt="inputsc" |
|
@timeCheck="timesc" |
|
@selectCheck="selectsc" |
|
@selection="selectionChange" |
|
:isselectfun="ProhibitSelection" |
|
> |
|
<template #default="slotProps"> |
|
<template v-if="slotProps.scope.column.label === '操作'"> |
|
<!-- --> |
|
<div class="ElBtnClass"> |
|
<el-button text @click="ClassificationIndicatorView(slotProps.scope)" |
|
>查看</el-button |
|
> |
|
<el-button |
|
v-if="slotProps.scope.row.isEdit != '0'" |
|
text |
|
@click="ClassificationDditing(slotProps.scope)" |
|
>编辑</el-button |
|
> |
|
<el-button |
|
v-if="slotProps.scope.row.isEdit == '1'" |
|
text |
|
type="primary" |
|
@click="CategoryDeletion(slotProps.scope)" |
|
>删除</el-button |
|
> |
|
</div> |
|
</template> |
|
</template> |
|
</tablecmt> |
|
</el-row> |
|
|
|
<!-- 分页模块 --> |
|
<div class="flex-c-sb"> |
|
<div></div> |
|
<el-pagination |
|
align="right" |
|
background |
|
@size-change="sizeChange" |
|
@current-change="currentChange" |
|
:current-page="current" |
|
:page-sizes="[30, 50, 80, 120]" |
|
:page-size="pageSize" |
|
layout="total, sizes, prev, pager, next, jumper" |
|
:total="total" |
|
> |
|
</el-pagination> |
|
</div> |
|
</div> |
|
|
|
<el-dialog v-model="newlyAdded" title="查看详情" width="60%"> |
|
<el-form |
|
v-loading="loadingAddPopup" |
|
:model="lassificationform" |
|
label-width="70px" |
|
class="el_listForm" |
|
disabled |
|
> |
|
<el-form-item label="指标名称"> |
|
<el-input v-model="lassificationform.classifyName" placeholder="暂无" /> |
|
</el-form-item> |
|
|
|
<el-form-item label="指标分类"> |
|
<el-input v-model="lassificationform.parentClassifyName" placeholder="暂无" /> |
|
</el-form-item> |
|
|
|
<el-form-item label="考核部门"> |
|
<el-input v-model="lassificationform.assessDeptName" placeholder="暂无" /> |
|
</el-form-item> |
|
|
|
<el-form-item label="考核分数"> |
|
<el-input v-model="lassificationform.point" placeholder="暂无" /> |
|
</el-form-item> |
|
|
|
<el-form-item label="整改结果"> |
|
<el-input |
|
:rows="2" |
|
type="textarea" |
|
v-model="lassificationform.objectionRemark" |
|
placeholder="暂无" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="考核人"> |
|
<el-input v-model="lassificationform.assessUserName" placeholder="暂无" /> |
|
</el-form-item> |
|
|
|
<el-form-item label="考评时间"> |
|
<el-input v-model="lassificationform.createTime" placeholder="暂无" /> |
|
</el-form-item> |
|
<!-- <el-form-item label="是否异议"> |
|
<el-input |
|
v-model="lassificationform.isObjection" |
|
placeholder=" |
|
暂无 |
|
" |
|
/> |
|
</el-form-item> --> |
|
<el-form-item label="指标状态"> |
|
<!-- /1 表示提交 2 表示审核 通过 3 表示审核失败 --> |
|
<el-input |
|
v-model="lassificationform.indicatorsStatus" |
|
placeholder=" |
|
暂无 |
|
" |
|
/> |
|
</el-form-item> |
|
<el-form-item label="意见反馈"> |
|
<el-input |
|
:rows="2" |
|
type="textarea" |
|
v-model="lassificationform.appealReason" |
|
placeholder="暂无" |
|
/> |
|
</el-form-item> |
|
<div class="el_photo_max"> |
|
<el-form-item label="照片" class="el_fotnr"> |
|
<el-upload |
|
v-model:file-list="srcList" |
|
list-type="picture-card" |
|
:on-preview="Photoviewing" |
|
> |
|
<el-icon><Plus /></el-icon> |
|
</el-upload> |
|
</el-form-item> |
|
</div> |
|
<div class="annex"> |
|
<el-form-item label="附件"> |
|
<el-upload |
|
v-model:file-list="fileList" |
|
class="upload-demo" |
|
:on-preview="fuj" |
|
:on-change="handleChange" |
|
> |
|
</el-upload> |
|
</el-form-item> |
|
</div> |
|
</el-form> |
|
<template #footer> |
|
<span class="dialog-footer"> |
|
<el-button @click="newlyAdded = false">取消</el-button> |
|
<el-button :disabled="loadingAddPopup" type="primary" @click="newlyAddedFn"> |
|
确定 |
|
</el-button> |
|
</span> |
|
</template> |
|
</el-dialog> |
|
|
|
<!-- 图片弹窗 --> |
|
<div class="dialodimg" width="30%"> |
|
<el-dialog v-model="dialogVisible"> |
|
<img w-full :src="dialogImageUrl" alt="Preview Image" /> |
|
</el-dialog> |
|
</div> |
|
|
|
<!-- 编辑弹窗 --> |
|
|
|
<el-dialog v-model="IndicatorEditing" title="编辑" width="30%"> |
|
<el-form v-loading="Indicatoreditingload" :model="lassificationformedit" label-width="70px"> |
|
<el-form-item label="考核部门" v-if="Assessmentstatus"> |
|
<el-tree-select |
|
v-model="lassificationformedit.assessDept" |
|
:data="AssessmentDepartment" |
|
check-strictly |
|
:render-after-expand="false" |
|
style="width: 240px" |
|
@node-click="handleNodeClick" |
|
/> |
|
</el-form-item> |
|
<el-form-item label="考核部门" v-else> |
|
<el-input |
|
v-model="lassificationformedit.assessDept" |
|
disabled |
|
placeholder="暂无考核部门" |
|
/> |
|
</el-form-item> |
|
<el-form-item label="指标分类"> |
|
<el-select |
|
v-model="lassificationformedit.indexClassification" |
|
class="m-2" |
|
placeholder="请选择指标分类" |
|
style="width: 100%" |
|
@change="ClassificationChange" |
|
:disabled="EditEnable" |
|
> |
|
<el-option |
|
v-for="item in classificationoptions" |
|
:key="item.id" |
|
:label="item.name" |
|
:value="item.id" |
|
/> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item label="指标项目"> |
|
<el-select |
|
v-model="lassificationformedit.Indicatoritems" |
|
class="m-2" |
|
placeholder="请选择指标项目" |
|
style="width: 100%" |
|
@change="IndicatoritemsChange" |
|
:disabled="EditEnable" |
|
> |
|
<el-option |
|
v-for="item in Indicatoritems" |
|
:key="item.id" |
|
:label="item.name" |
|
:value="item.id" |
|
/> |
|
</el-select> |
|
</el-form-item> |
|
|
|
<el-form-item label="指标分数"> |
|
<el-select |
|
v-model="lassificationformedit.IndicatorScore" |
|
class="m-2" |
|
placeholder="请选择指标分数" |
|
style="width: 100%" |
|
:disabled="EditEnable" |
|
> |
|
<el-option |
|
v-for="item in IndicatorScore" |
|
:key="item.id" |
|
:label="item.point" |
|
:value="item.id" |
|
/> |
|
</el-select> |
|
</el-form-item> |
|
|
|
<el-form-item label="考核人"> |
|
<el-input |
|
v-model="lassificationformedit.assessUserName" |
|
disabled |
|
placeholder="请输入考核人" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="分数备注"> |
|
<el-input |
|
v-model="lassificationformedit.textarea" |
|
:rows="4" |
|
type="textarea" |
|
placeholder="请输入分数备注" |
|
:disabled="EditEnable" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="整改结果回复"> |
|
<el-input |
|
v-model="lassificationformedit.objectionRemark" |
|
:rows="4" |
|
type="textarea" |
|
placeholder="请输入整改结果回复内容" |
|
/> |
|
</el-form-item> |
|
|
|
<el-form-item label="意见反馈"> |
|
<el-input |
|
v-model="lassificationformedit.appealReason" |
|
:rows="4" |
|
type="textarea" |
|
placeholder="请输入意见反馈" |
|
/> |
|
</el-form-item> |
|
|
|
<div class="el_photo_max"> |
|
<el-form-item label="照片" class="el_fotnr"> |
|
<el-upload |
|
disabled |
|
v-model:file-list="srcList" |
|
list-type="picture-card" |
|
:on-preview="Photoviewing" |
|
> |
|
<el-icon><Plus /></el-icon> |
|
</el-upload> |
|
</el-form-item> |
|
</div> |
|
<div class="annex"> |
|
<el-form-item label="附件"> |
|
<el-upload |
|
disabled |
|
v-model:file-list="fileList" |
|
class="upload-demo" |
|
:on-preview="fuj" |
|
:on-change="handleChange" |
|
> |
|
</el-upload> |
|
</el-form-item> |
|
</div> |
|
</el-form> |
|
|
|
<template #footer> |
|
<span class="dialog-footer"> |
|
<el-button @click="IndicatorEditing = false">关闭</el-button> |
|
<el-button :disabled="Indicatoreditingload" type="primary" @click="IndicatorEditingFn"> |
|
确定 |
|
</el-button> |
|
</span> |
|
</template> |
|
</el-dialog> |
|
</basic-container> |
|
|
|
<!-- 列表配置显示 --> |
|
<edittablehead |
|
@setcolum="setnewcolum" |
|
@closce="showdrawer" |
|
:drawerShow="drawerShow" |
|
:columnList="IndicatorColumnList" |
|
></edittablehead> |
|
</template> |
|
|
|
<script setup> |
|
import { ElMessage, ElMessageBox } from 'element-plus'; |
|
import { ref, reactive, computed, onMounted } from 'vue'; |
|
import { IndicatorColumnList } from '@/option/supervise/supervise.js'; |
|
import functions from '@/utils/functions.js'; |
|
import { setNodeHeight } from '@/utils/util'; |
|
import { downloadXls } from '@/utils/util'; |
|
import { |
|
$_Getclassify, |
|
$_newlyadded, |
|
$_newlyremove, |
|
$_classifyAddChild, |
|
$_findIndicatorsList, |
|
$_findIndicatorsDetail, |
|
$_updateIndicators, |
|
$_removeByIds, |
|
$_selectChildCalssifyList, |
|
$_selectParentCalssifyList, |
|
$_parentId, |
|
$_selectPointList, |
|
$_exportIndicatorsList, |
|
} from '@/api/classify/classify'; |
|
const loadingclassification = ref(false); //指标分类加载效果 |
|
const classificationdata = ref([]); //指标分类数据 |
|
const current = ref(1); //当前页 |
|
const total = ref(0); //总页数 |
|
const dialogVisible = ref(false); //图片弹窗 |
|
const fileList = ref([]); //附件列表 |
|
const IndicatorEditing = ref(false); //编辑弹窗 |
|
const pageSize = ref(50); |
|
const lassificationform = ref({}); //分类表单 |
|
const lassificationformedit = ref({}); //编辑分类表单 |
|
const title = ref(true); //标题 |
|
const EditEnable = ref(true); //是否可以编辑 |
|
const EditID = ref(true); //编辑需要的ID |
|
const currentPage = ref(1); |
|
const newlyAdded = ref(false); //新增弹窗 |
|
const loadingAddPopup = ref(false); //弹窗加载 |
|
const selectionList = ref([]); //选中数据 |
|
const classificationoptions = ref([]); //指标分类 |
|
const searchFrom = ref({}); //搜索表单 |
|
const Indicatoritems = ref([]); //指标项目 |
|
const drawerShow = ref(false); //抽屉显示隐藏 |
|
const search = ref(true); //头部搜索 |
|
const department = ref(); //考核部门存储 |
|
const Indicatorediting = ref({}); //编辑表单 |
|
const query = ref({}); //搜索 |
|
const dialogImageUrl = ref(''); //图片地址 |
|
const columnList = ref(); |
|
const indicatorsValue = ref(0); //分类初始值 |
|
const indicatorsValues = ref(1); //子类 |
|
const IndicatorScore = ref([]); //指标分数 |
|
const Assessmentstatus = ref(true); //编辑考核部门状态 |
|
const Indicatoreditingload = ref(false); //编辑加载 |
|
const AssessmentDepartment = ref([]); //考核部门 |
|
const tempRow = ref(); //编辑信息 |
|
const url = ref(''); |
|
const fuj = val => { |
|
console.log(val); |
|
|
|
ElMessageBox.confirm('是否下载该文件?', 'Warning', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}) |
|
.then(() => { |
|
window.open(val.url); |
|
}) |
|
.catch(() => {}); |
|
}; |
|
const srcList = ref([]); |
|
/** 表格实例 */ |
|
const tableNode = ref(); |
|
const onLoad = () => { |
|
let data = { |
|
current: current.value, |
|
size: pageSize.value, |
|
...query.value, //搜索参数 |
|
}; |
|
loadingclassification.value = true; //开启加载效果 |
|
$_findIndicatorsList(data) |
|
.then(res => { |
|
console.log(res); |
|
if (res.data.data.records) { |
|
// 指标状态1 表示提交 2 表示审核通过 3 表示审核失败 |
|
|
|
res.data.data.records.forEach(item => { |
|
if (item.indicatorsStatus == 1) { |
|
item.indicatorsStatus = '已提交'; |
|
} else if (item.indicatorsStatus == 2) { |
|
item.indicatorsStatus = '已确认'; |
|
} else if (item.indicatorsStatus == 3) { |
|
item.indicatorsStatus = '未确认'; |
|
} |
|
|
|
// 是否存在异议 0 表示没有1表示存在 |
|
if (item.isObjection != null) { |
|
if (item.isObjection) { |
|
item.isObjection = '没有'; |
|
} else { |
|
item.isObjection = '存在'; |
|
} |
|
} |
|
}); |
|
|
|
classificationdata.value = res.data.data.records; //数据 |
|
} |
|
total.value = res.data.data.total; //总页数 |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
loadingclassification.value = false; //开启加载效果 |
|
}); |
|
}; |
|
onLoad(); |
|
// 条数 |
|
const sizeChange = val => { |
|
pageSize.value = val; |
|
onLoad(); |
|
}; |
|
// 页码 |
|
const currentChange = val => { |
|
current.value = val; |
|
onLoad(); |
|
}; |
|
|
|
// 获取分类指标 |
|
// 在外部定义递归函数，用于加载和更新分类 |
|
const loadChildren = (targetList, parentId, indicatorValue) => { |
|
let dataSub = { parentId }; |
|
return $_parentId(dataSub).then(Rs => { |
|
const children = Rs.data.data.map(item => ({ |
|
value: item.value, |
|
label: item.title, |
|
id: item.id, |
|
key: item.key, |
|
hasChildren: item.hasChildren, // 假定hasChildren是一个布尔值 |
|
children: [], |
|
})); |
|
|
|
function findAndReplace(target, value) { |
|
for (let i = 0; i < target.length; i++) { |
|
if (target[i].value === value) { |
|
target[i].children = children; |
|
break; |
|
} |
|
if (target[i].children && target[i].children.length > 0) { |
|
findAndReplace(target[i].children, value); |
|
} |
|
} |
|
} |
|
|
|
findAndReplace(targetList, indicatorValue); // 查找并替换targetList的正确位置 |
|
|
|
const childRequests = children |
|
.filter(child => child.hasChildren) |
|
.map(child => loadChildren(targetList, child.id, child.value)); // 使用完整的targetList进行递归 |
|
|
|
// 等待所有子分类都加载完毕 |
|
return Promise.all(childRequests); |
|
}); |
|
}; |
|
// 当分类项被点击时调用 |
|
const classification = (val, index) => { |
|
console.log(index, '当前点击的谁'); |
|
|
|
const currentCategory = AssessmentDepartment.value.find(category => category.value === index); |
|
if (currentCategory) { |
|
if (currentCategory.hasChildren && currentCategory.children.length === 0) { |
|
// 当前分类有子分类并且尚未加载子分类，触发加载子分类的操作 |
|
console.log('当前点击的是有子分类但未加载的父分类'); |
|
loadChildren(AssessmentDepartment.value, val, index); |
|
} else { |
|
// 当前分类已经加载子分类或者没有子分类，无需进一步操作 |
|
console.log('当前点击的分类没有子分类或子分类已加载'); |
|
} |
|
} else { |
|
console.log('分类不存在于当前的分类列表中'); |
|
} |
|
}; |
|
// 初始时获取顶级分类 |
|
const loadInitialCategories = (val = 0) => { |
|
let dataSub = { parentId: val }; |
|
$_parentId(dataSub).then(res => { |
|
console.log(res, '初始化顶级分类-------'); |
|
res.data.data.forEach(item => { |
|
setTimeout(() => { |
|
classification(item.id, item.value); |
|
}, 0); |
|
AssessmentDepartment.value.push({ |
|
value: item.value, |
|
label: item.title, |
|
id: item.id, |
|
key: item.key, |
|
hasChildren: item.hasChildren, |
|
children: [], // 初始化子分类列表 |
|
}); |
|
}); |
|
}); |
|
}; |
|
|
|
loadInitialCategories(); |
|
// 图片查看 |
|
const Photoviewing = val => { |
|
dialogVisible.value = true; |
|
console.log('图片查看', val); |
|
dialogImageUrl.value = val.url; |
|
}; |
|
|
|
// 获取指标分类 |
|
const Obtainclassification = () => { |
|
$_selectParentCalssifyList().then(res => { |
|
classificationoptions.value = res.data.data; |
|
}); |
|
}; |
|
|
|
const handleNodeClick = (data, node, component) => { |
|
// 'data' 是点击的节点数据 |
|
// 'node' 是 Node 对象 |
|
// 'component' 是组件的引用 |
|
// console.log('You clicked:', data); |
|
department.value = data; //存储当前点击的考核部门 |
|
console.log(department.value, '当前点击的考核部门'); |
|
if (data.hasChildren) { |
|
classification(data.id, data.value); |
|
} |
|
|
|
// 根据你的需求处理点击事件 |
|
}; |
|
const assessDeptChange = () => { |
|
if (!searchFrom.value.assessDept) { |
|
query.value.assessDept = null; |
|
onLoad(); |
|
} |
|
console.log(searchFrom.value.assessDept, '当前点击的考核部门'); |
|
}; |
|
// 归属部门查询 |
|
const Belongingdepartment = () => { |
|
if (!searchFrom.value.createDeptName) { |
|
query.value.createDeptName = null; |
|
onLoad(); |
|
} |
|
}; |
|
// 考核部门搜索 |
|
const searcheNodeClick = (data, node, component) => { |
|
// 'data' 是点击的节点数据 |
|
// 'node' 是 Node 对象 |
|
// 'component' 是组件的引用 |
|
// console.log('You clicked:', data); |
|
department.value = data; //存储当前点击的考核部门 |
|
console.log(department.value, '当前点击的考核部门'); |
|
if (data.hasChildren) { |
|
classification(data.id, data.value); |
|
} |
|
// query.value.assessDeptName = data.label |
|
query.value.assessDept = data.id; |
|
onLoad(); |
|
// 根据你的需求处理点击事件 |
|
}; |
|
|
|
const Indicatortype = () => { |
|
const _item = classificationoptions.value.find(res => res.id == searchFrom.value.classifyId); |
|
if (_item) query.value.parentClassifyId = _item.id; |
|
else delete query.value.parentClassifyId; |
|
// searchFrom.classifyId |
|
onLoad(); |
|
}; |
|
Obtainclassification(); |
|
// 分类新增按钮 |
|
const AddCategory = () => {}; |
|
|
|
// 批量删除分类 |
|
const BatchDelete = () => { |
|
if (!selectionList.value.length) { |
|
ElMessage({ |
|
message: '请勾选要批量删除的数据', |
|
type: 'warning', |
|
}); |
|
return; |
|
} |
|
loadingclassification.value = true; //开启加载效果 |
|
|
|
let data = { |
|
id: [], |
|
}; |
|
data['id'] = selectionList.value.map(res => res.id); |
|
data['id'] = data['id'].join(','); |
|
console.log(data, '批量删除'); |
|
|
|
$_removeByIds(data) |
|
.then(res => { |
|
console.log(res, '删除成功返回值'); |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
onLoad(); |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
loadingclassification.value = false; //关闭加载效果 |
|
}); |
|
}; |
|
|
|
// 导出 |
|
const exportList = () => { |
|
ElMessageBox.confirm('是否导出数据?', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}) |
|
.then(() => { |
|
console.log('导出数据'); |
|
let data = { |
|
...searchFrom.value, |
|
}; |
|
$_exportIndicatorsList(data).then(res => { |
|
downloadXls(res.data, `导出数据.xlsx`); |
|
}); |
|
}) |
|
.catch(() => {}); |
|
}; |
|
// 分类删除 |
|
const CategoryDeletion = val => { |
|
ElMessageBox.confirm(`是否删除${val.row.classifyName}分类?`, 'Warning', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}) |
|
.then(() => { |
|
loadingclassification.value = true; //开启加载效果 |
|
console.log(val, '分类删除'); |
|
let data = { |
|
id: [], |
|
}; |
|
data['id'].push(val.row.id); |
|
data['id'] = data['id'].join(','); |
|
$_removeByIds(data) |
|
.then(res => { |
|
if (res.data.code == 200) { |
|
console.log(res, '删除成功返回值'); |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
onLoad(); |
|
} |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
loadingclassification.value = false; //关闭加载效果 |
|
}); |
|
onLoad(); |
|
}) |
|
.catch(() => {}); |
|
}; |
|
|
|
/** 展开列表控件 */ |
|
const showdrawer = _flag => { |
|
drawerShow.value = _flag; |
|
}; |
|
/** |
|
* 设置列表 -- 固定函数 |
|
* 弹窗的勾选回调，用于更改头部数组 |
|
* 固定搭配，只需要更换 columnList |
|
* */ |
|
const setnewcolum = (newarr, headarr, type) => { |
|
if (type == 1) { |
|
columnList.value = newarr; |
|
functions.setStorage(window.location.pathname + 'checkList', headarr); |
|
} |
|
}; |
|
// 新增/编辑分类 |
|
const newlyAddedFn = () => { |
|
loadingclassification.value = true; //开启加载效果 |
|
let data = { |
|
...lassificationform.value, |
|
pId: 0, ///是否父指标 默认0 |
|
}; |
|
if (title.value) { |
|
console.log(data, '新增分类'); |
|
} else { |
|
data.id = EditID.value; |
|
} |
|
|
|
$_newlyadded(data) |
|
.then(res => { |
|
console.log(res, '新增成功返回值'); |
|
if (res.data.code == 200) { |
|
onLoad(); |
|
newlyAdded.value = false; //关闭弹窗 |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
} |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
loadingAddPopup.value = false; //关闭弹窗加载效果 |
|
loadingclassification.value = false; //关闭加载效果 |
|
}); |
|
}; |
|
// 表格选择 |
|
const selectionChange = list => { |
|
selectionList.value = list; |
|
console.log(selectionList.value, '已经选中的数据'); |
|
}; |
|
function ProhibitSelection(val, index) { |
|
if (val.isEdit == '1') { |
|
return true; |
|
} else { |
|
return false; |
|
} |
|
} |
|
const searchHide = () => { |
|
search.value = !search.value; |
|
|
|
setNodeHeight(tableNode.value.$el, '', true); |
|
}; |
|
|
|
const BelongsearcheNodeClick = data => { |
|
department.value = data; //存储当前点击的考核部门 |
|
if (data.hasChildren) { |
|
classification(data.id, data.value); |
|
} |
|
query.value.createDeptName = data.label; |
|
onLoad(); |
|
console.log(data); |
|
}; |
|
// 指标分类选择 |
|
const ClassificationChange = val => { |
|
console.log(val); |
|
classificationindicators(val); |
|
}; |
|
// 分类指标 |
|
const classificationindicators = val => { |
|
$_selectChildCalssifyList({ pid: val }).then(res => { |
|
console.log(res, '分类列表'); |
|
if (res.data.data) { |
|
Indicatoritems.value = res.data.data; |
|
} |
|
}); |
|
}; |
|
const IndicatoritemsChange = val => { |
|
selectPointListChange(val); |
|
}; |
|
// 指标分数获取 |
|
const selectPointListChange = val => { |
|
$_selectPointList({ id: val }).then(res => { |
|
console.log(res, '分数列表'); |
|
if (res.data.data) { |
|
IndicatorScore.value = res.data.data; |
|
if (!Assessmentstatus.value) { |
|
lassificationformedit.value.IndicatorScore = IndicatorScore.value.find( |
|
res => res.point == tempRow.value.point |
|
).id; |
|
} |
|
} |
|
}); |
|
}; |
|
// 查看信息 |
|
const ClassificationIndicatorView = val => { |
|
srcList.value = []; |
|
fileList.value = []; |
|
console.log(val, '查看信息'); |
|
newlyAdded.value = true; //开启弹窗 |
|
$_findIndicatorsDetail({ id: val.row.id }) |
|
.then(res => { |
|
loadingAddPopup.value = true; //开启弹窗加载效果 |
|
console.log(res, '查看信息返回值'); |
|
lassificationform.value = res.data.data; //赋值给弹窗表单 |
|
// 指标状态1 表示提交 2 表示审核 通过 3 表示审核失败 |
|
if (res.data.data.indicatorsStatus == 1) { |
|
lassificationform.value.indicatorsStatus = '已提交'; |
|
} else if (res.data.data.indicatorsStatus == 2) { |
|
lassificationform.value.indicatorsStatus = '已确认'; |
|
} else if (res.data.data.indicatorsStatus == 3) { |
|
lassificationform.value.indicatorsStatus = '未确认'; |
|
} |
|
|
|
// 是否存在异议 0 表示没有1表示存在 |
|
if (res.data.data.isObjection == '0') { |
|
lassificationform.value.isObjection = '没有'; |
|
} else if (res.data.data.isObjection == '1') { |
|
lassificationform.value.isObjection = '存在'; |
|
} |
|
console.log(res.data.data.pictures, '图片列表'); |
|
url.value = res.data.data.pictures[0].url; //赋值给弹窗图片 |
|
res.data.data.pictures.forEach(res => { |
|
if (res.url) { |
|
srcList.value.push({ name: res.name, url: res.url }); |
|
} |
|
}); |
|
// 附件 |
|
|
|
res.data.data.files.forEach(res => { |
|
if (res.url) { |
|
fileList.value.push({ name: res.name, url: res.url }); |
|
} |
|
}); |
|
// if (res.data.data.pictures.length) { |
|
// // 图片 |
|
// url.value = res.data.data.pictures[0].url; //赋值给弹窗图片 |
|
// console.log(url.value, '图片地址'); |
|
|
|
// } |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
loadingAddPopup.value = false; //关闭弹窗加载效果 |
|
}); |
|
}; |
|
// 分类编辑 |
|
// @ApiModelProperty(value = "考核部门") |
|
// private Long assessDept; |
|
|
|
// @ApiModelProperty(value = "考核部门名称") |
|
// private String assessDeptName; |
|
|
|
// @ApiModelProperty(value = "考核人") |
|
// private Long assessUserId; |
|
|
|
// @ApiModelProperty(value = "考核人名称") |
|
// private String assessUserName; |
|
|
|
// @ApiModelProperty(value = "考核指标") |
|
// private Long classifyId; |
|
|
|
// @ApiModelProperty(value = "分数") |
|
// private int point; |
|
|
|
// @ApiModelProperty(value = "考核备注") |
|
// private String remark; |
|
|
|
// @ApiModelProperty(value = "指标状态 1 表示提交 2 表示审核 通过 3 表示审核失败") |
|
// private Integer indicatorsStatus; |
|
|
|
// @ApiModelProperty(value = "是否存在异议 0 表示没有 1 表示存在") |
|
// private Integer isObjection; |
|
|
|
// @ApiModelProperty(value = "异议备注") |
|
// private String objectionRemark; |
|
|
|
// 编辑弹窗展开 |
|
const ClassificationDditing = async val => { |
|
console.log(val, '编辑弹窗展开'); |
|
if (val.row.isEdit == 1) { |
|
EditEnable.value = false; |
|
} else if (val.row.isEdit == 2) { |
|
EditEnable.value = true; |
|
} |
|
srcList.value = []; |
|
fileList.value = []; |
|
$_findIndicatorsDetail({ id: val.row.id }) |
|
.then(res => { |
|
lassificationformedit.value.appealReason = val.row.appealReason; //申诉原因 |
|
console.log(res.data.data.pictures, '图片列表'); |
|
url.value = res.data.data.pictures[0].url; //赋值给弹窗图片 |
|
res.data.data.pictures.forEach(res => { |
|
if (res.url) { |
|
srcList.value.push({ name: res.name, url: res.url }); |
|
} |
|
}); |
|
res.data.data.files.forEach(res => { |
|
if (res.url) { |
|
fileList.value.push({ name: res.name, url: res.url }); |
|
} |
|
}); |
|
// 附件 |
|
|
|
// res.data.data.files.forEach(res => { |
|
// if (res.url) { |
|
// fileList.value.push({ name: res.name, url: res.url }); |
|
// } |
|
// }); |
|
}) |
|
.catch(res => {}) |
|
.finally(() => {}); |
|
Indicatoreditingload.value = true; |
|
IndicatorEditing.value = true; //编辑弹窗展开 |
|
tempRow.value = val.row; //保存当前行数据到临时变量中，以便在编辑弹窗中使用。 |
|
Assessmentstatus.value = false; //禁止修改考核部门 |
|
console.log(val, '编辑'); |
|
IndicatorScore.value = []; //指标分数重置 |
|
Indicatoritems.value = []; //指标项目重置 |
|
|
|
lassificationformedit.value.IndicatorScore = ''; //重置指标分数 |
|
// lassificationformedit.value.Indicatoritems='' |
|
|
|
await ClassificationChange(val.row.parentClassifyId); //获取指标项目，传入指标分类ID |
|
await IndicatoritemsChange(val.row.classifyId); //通过指标项目DI获取指标分数 |
|
lassificationformedit.value.indexClassification = val.row.parentClassifyId; //指标项目ID |
|
|
|
lassificationformedit.value.Indicatoritems = val.row.classifyId; //指标项目ID |
|
lassificationformedit.value.assessDept = val.row.assessDeptName; //考核部门名称 |
|
// 固定值 |
|
lassificationformedit.value.objectionRemark = val.row.objectionRemark; //异议描述 |
|
lassificationformedit.value.textarea = val.row.remark; //分数备注 |
|
lassificationformedit.value.assessUserName = val.row.assessUserName; //考核人名称 |
|
|
|
// 固定值 |
|
// lassificationformedit.value.IndicatorScore = IndicatorScore.value.find(res=>res.point == val.row.point).id, //指标分数 |
|
EditID.value = val.row.id; //编辑需要的ID |
|
let data = val.row; |
|
|
|
classification(); |
|
Indicatoreditingload.value = false; |
|
}; |
|
|
|
// 编辑信息 |
|
const IndicatorEditingFn = () => { |
|
let data = { |
|
id: EditID.value, //编辑id |
|
// assessDept: department.value.id, //考核部门ID |
|
// assessDeptName: department.value.label , //考核部门名称 |
|
// assessUserId: '', //考核人ID |
|
// assessUserName: lassificationformedit.value.assessUserName, //考核人名称 |
|
point: IndicatorScore.value.find(res => res.id == lassificationformedit.value.IndicatorScore) |
|
.point, //指标分数 |
|
remark: lassificationformedit.value.textarea, //分数备注 |
|
objectionRemark: lassificationformedit.value.objectionRemark, //异议描述 |
|
// 指标项目名称 |
|
classifyId: lassificationformedit.value.Indicatoritems, // 指标项目ID |
|
classifyName: Indicatoritems.value.find( |
|
res => res.id == lassificationformedit.value.Indicatoritems |
|
).name, //指标项目名称 |
|
appealReason: lassificationformedit.value.appealReason, //申诉原因 |
|
}; |
|
console.log(data, '处理好的参数'); |
|
Indicatoreditingload.value = true; //开启加载 |
|
$_updateIndicators(data) |
|
.then(res => { |
|
console.log(res, '编辑成功'); |
|
if (res.data.code == 200) { |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
IndicatorEditing.value = false; //编辑弹窗关闭 |
|
onLoad(); |
|
} |
|
}) |
|
.catch(res => {}) |
|
.finally(() => { |
|
Assessmentstatus.value = true; //可以修改考核部门 |
|
Indicatoreditingload.value = false; //关闭加载 |
|
}); |
|
}; |
|
const searchChangeS = () => { |
|
searchFrom.value = {}; //重置搜索参数 |
|
query.value = {}; |
|
onLoad(); |
|
}; |
|
// 查询搜索 |
|
const searchChange = () => { |
|
searchFrom.createTime; |
|
if (searchFrom.value.createTime) { |
|
(query.value.startDateStr = searchFrom.value.createTime[0]), |
|
(query.value.endDateStr = searchFrom.value.createTime[1]); |
|
} |
|
// ...searchFrom.value, |
|
onLoad(); |
|
}; |
|
const timeChange = val => { |
|
console.log('val :>> ', val); |
|
|
|
if (val) { |
|
query.value.startDateStr = val[0]; |
|
query.value.endDateStr = val[1]; |
|
} else { |
|
delete query.value.startDateStr; |
|
delete query.value.endDateStr; |
|
} |
|
onLoad(); |
|
}; |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
.demo-tabs > .el-tabs__content { |
|
padding: 32px; |
|
color: #6b778c; |
|
font-size: 32px; |
|
font-weight: 600; |
|
} |
|
.ElBtnClass { |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-evenly; |
|
} |
|
.el_listForm { |
|
display: flex; |
|
flex-wrap: wrap; |
|
:deep(.el-form-item) { |
|
justify-content: flex-end !important; |
|
width: 30%; |
|
} |
|
:deep(.el-form-item__content) { |
|
align-items: flex-start !important; |
|
} |
|
} |
|
.demo-image__error .image-slot { |
|
font-size: 30px; |
|
} |
|
.demo-image__error .image-slot .el-icon { |
|
font-size: 30px; |
|
} |
|
.demo-image__error .el-image { |
|
width: 100%; |
|
height: 200px; |
|
} |
|
.el_header_top { |
|
.el-form { |
|
// display: flex; |
|
// justify-content: space-between; |
|
// width: 100%; |
|
.el-form-item { |
|
margin: 4px 0; |
|
margin-right: 10px; |
|
} |
|
.el-btn { |
|
width: auto; |
|
margin-right: 0; |
|
margin-left: auto; |
|
} |
|
} |
|
:deep(.el-date-editor) { |
|
height: 100% !important; |
|
} |
|
} |
|
:deep(.el-card) { |
|
height: 100% !important; |
|
.el-card__body { |
|
height: 100%; |
|
.content_max { |
|
display: flex; |
|
flex-direction: column; |
|
height: 100%; |
|
.el-fy { |
|
flex: 1; |
|
display: flex; |
|
align-items: flex-end; |
|
margin-bottom: 10px; |
|
} |
|
} |
|
} |
|
} |
|
// .maboxhi { |
|
// height: 700px !important; |
|
// } |
|
.el_fotnr { |
|
:deep(.el-upload) { |
|
display: none; |
|
} |
|
} |
|
:deep(.el_photo_max) { |
|
width: 100%; |
|
.el-form-item { |
|
width: 100%; |
|
} |
|
} |
|
:deep(.annex) { |
|
width: 100%; |
|
.el-upload { |
|
display: none; |
|
} |
|
} |
|
:deep(.dialodimg) { |
|
width: 40%; |
|
height: 300px; |
|
|
|
.el-dialog { |
|
width: 40%; |
|
height: 50%; |
|
display: flex; |
|
justify-content: center; |
|
flex-direction: column; |
|
align-items: center; |
|
.el-dialog__body { |
|
width: fit-content; |
|
height: -webkit-fill-available; |
|
img { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
} |
|
} |
|
} |
|
</style>
|
|
|