425 lines
14 KiB
Vue
425 lines
14 KiB
Vue
<template>
|
||
|
||
<el-form class="el_form" :model="formData" ref="addForm" :rules="formRules" label-width="100px">
|
||
<table-tool label="指标信息"></table-tool>
|
||
<template v-if="!is_view">
|
||
<el-row :gutter="20">
|
||
<el-col :span="6">
|
||
<el-form-item prop="annual" label="年  度">
|
||
<el-date-picker
|
||
style="width: 100%"
|
||
:picker-options="pickerOptions"
|
||
v-model="formData.annual"
|
||
type="year"
|
||
value-format="yyyy"
|
||
placeholder="请选择年度">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item prop="assessment" label="考核名称">
|
||
<el-input maxlength="30" v-model="formData.assessment" placeholder="请输入考核名称" type="text"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item prop="assessment" label="">
|
||
<el-checkbox v-model="formData.isEvaluationIndex">是否采用往年考核指标</el-checkbox>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item prop="zbId" label="往年指标" v-if="formData.isEvaluationIndex">
|
||
<el-select v-model="formData.zbId" placeholder="请选择指标" filterable clearable
|
||
style="width: 100%" @change="getByZbData">
|
||
<el-option
|
||
v-for="item in zbList"
|
||
:key="item.id"
|
||
:label="item.annual+item.assessment"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="20">
|
||
<el-col :span="12">
|
||
<el-form-item prop="fillTime" label="填报时间">
|
||
<el-date-picker
|
||
style="width: 100%"
|
||
v-model="formData.fillTimeRange"
|
||
type="datetimerange"
|
||
value-format="yyyy-MM-dd HH:mm:ss"
|
||
start-placeholder="填报开始时间"
|
||
end-placeholder="填报结束时间">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item prop="appealTime" label="申诉时间">
|
||
<el-date-picker
|
||
style="width: 100%"
|
||
v-model="formData.appealTimeRange"
|
||
type="datetimerange"
|
||
value-format="yyyy-MM-dd HH:mm:ss"
|
||
start-placeholder="申诉开始时间"
|
||
end-placeholder="申诉结束时间">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</template>
|
||
|
||
<el-descriptions border class="descriptions-form" v-if="is_view" :column="2">
|
||
<el-descriptions-item label="年度">{{ formData.annual }}</el-descriptions-item>
|
||
<el-descriptions-item label="考核名称">{{ formData.assessment }}</el-descriptions-item>
|
||
<el-descriptions-item label="填报时间">{{ formData.startDateTime }} 至 {{ formData.endDateTime }}</el-descriptions-item>
|
||
<el-descriptions-item label="申诉时间">{{ formData.startApplyTime }} 至 {{ formData.endApplyTime }}</el-descriptions-item>
|
||
</el-descriptions>
|
||
|
||
<table-tool label="考核内容" class="mt10"></table-tool>
|
||
|
||
<el-form-item label="" label-width="0" v-for="(nr,idx) in formData.nrs" :key="idx">
|
||
<el-row type="flex" justify="space-between">
|
||
<div style="width: 80%">
|
||
<el-input v-model="nr.content" :disabled="is_view" maxlength="30" style="width: 68%" placeholder="请填写考核内容">
|
||
<template slot="prepend"><span>{{ idx + 1 }}</span></template>
|
||
</el-input>
|
||
<el-select v-model="nr.auditUser" :disabled="is_view" placeholder="请根据姓名或工号选择审核人" style="width: 300px"
|
||
remote reserve-keyword :remote-method="selectUser"
|
||
clearable filterable>
|
||
<el-option
|
||
v-for="item in userOptions"
|
||
:key="item.loginName"
|
||
:label="item.userName + item.loginName + '(' + item.unitName + ')'"
|
||
:value="item.loginName">
|
||
</el-option>
|
||
</el-select>
|
||
|
||
</div>
|
||
<div style="display: flex; gap: 10px;">
|
||
<el-button v-if="!is_view" size="small" icon="el-icon-plus" type="primary"
|
||
@click="formData.nrs.push({bzs:[{}], auditUser: ''})">
|
||
添加内容
|
||
</el-button>
|
||
<el-button v-if="!is_view" size="small" :disabled="formData.nrs.length<=1" type="danger"
|
||
@click="formData.nrs.splice(idx,1)" icon="el-icon-delete">
|
||
</el-button>
|
||
</div>
|
||
</el-row>
|
||
|
||
|
||
|
||
<el-row style="margin-top: 20px">
|
||
<el-table :data="nr.bzs" style="width: 100%" border show-summary :summary-method="getSummaries" size="small">
|
||
<el-table-column label="序号" type="index" width="50px">
|
||
</el-table-column>
|
||
|
||
<el-table-column label="考核标准" prop="inspection" >
|
||
<template v-slot="{row}">
|
||
<el-input v-if="!is_view" v-model="row.inspection" placeholder="请填写考核标准"></el-input>
|
||
<span v-else>{{ row.inspection }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="单项分" prop="single_score" width="200px">
|
||
<template v-slot="{row}">
|
||
<el-input v-if="!is_view" v-model="row.single_score" placeholder="请填写单项分"></el-input>
|
||
<span v-else>{{ row.single_score }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="标准分" prop="score" width="200px">
|
||
<template v-slot="{row}">
|
||
<el-input v-if="!is_view" v-model.number="row.score" maxlength="4" placeholder="请填写标准分"></el-input>
|
||
<span v-else>{{ row.score }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="考核验收方式" prop="remark" width="300px">
|
||
<template v-slot="{row}">
|
||
<el-input v-if="!is_view" v-model.number="row.remark" placeholder="请填写考核验收方式"></el-input>
|
||
<span v-else>{{ row.remark }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="能否超过标准分" prop="beyond_highestscore" width="120px">
|
||
<template v-slot="{row}">
|
||
<el-switch
|
||
v-if="!is_view"
|
||
v-model="row.beyond_highestscore"
|
||
active-color="#13ce66"
|
||
inactive-color="#ff4949">
|
||
</el-switch>
|
||
<el-switch
|
||
v-else
|
||
disabled
|
||
v-model="row.beyond_highestscore">
|
||
</el-switch>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
|
||
<el-table-column label="是否提供佐证材料" prop="isEvidence" width="120px">
|
||
<template v-slot="{row}">
|
||
<el-switch
|
||
v-if="!is_view"
|
||
v-model="row.isEvidence"
|
||
active-color="#13ce66"
|
||
inactive-color="#ff4949">
|
||
</el-switch>
|
||
<el-switch
|
||
v-else
|
||
disabled
|
||
v-model="row.isEvidence">
|
||
</el-switch>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<!-- <el-table-column label="关联模块" prop="associatedmodule" width="200px">-->
|
||
<!-- <template v-slot="{row}">-->
|
||
<!-- <el-input v-if="!is_view" v-model="row.associatedmodule" maxlength="10" placeholder="请填写关联模块"></el-input>-->
|
||
<!-- <span v-else>{{ row.associatedmodule }}</span>-->
|
||
<!-- </template>-->
|
||
<!-- </el-table-column>-->
|
||
|
||
<!-- <el-table-column label="关联标识" prop="bz_relation_id" width="100px">-->
|
||
<!-- <template v-slot="{row}">-->
|
||
<!-- <el-input v-if="!is_view" v-model="row.bz_relation_id" maxlength="20" placeholder="请填写关联标识,该标识唯一"></el-input>-->
|
||
<!-- <span v-else>{{ row.bz_relation_id }}</span>-->
|
||
<!-- </template>-->
|
||
<!-- </el-table-column>-->
|
||
|
||
<!-- <el-table-column label="能否删除" prop="canDelete" width="100px">-->
|
||
<!-- <template v-slot="{row}">-->
|
||
<!-- <el-switch-->
|
||
<!-- v-if="!is_view"-->
|
||
<!-- :disabled="row.canDelete==false"-->
|
||
<!-- v-model="row.canDelete"-->
|
||
<!-- active-color="#13ce66"-->
|
||
<!-- inactive-color="#ff4949">-->
|
||
<!-- </el-switch>-->
|
||
<!-- <el-switch-->
|
||
<!-- v-else-->
|
||
<!-- :disabled="!row.canDelete && row.id"-->
|
||
<!-- v-model="row.canDelete">-->
|
||
<!-- </el-switch>-->
|
||
<!-- </template>-->
|
||
<!-- </el-table-column>-->
|
||
|
||
<el-table-column v-if="!is_view" label="操作" width="100px">
|
||
<template v-slot="{row,$index}">
|
||
<!-- 新建行没有 id 时允许删除；已保存行仍按 canDelete 控制删除权限。 -->
|
||
<el-button size="mini" :disabled="nr.bzs.length<=1 || (!row.canDelete && row.id)" type="danger" icon="el-icon-delete"
|
||
@click="nr.bzs.splice($index,1)"></el-button>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
</el-table>
|
||
|
||
<el-button v-if="!is_view" type="primary" plain style="width: 100%" size="mini" icon="el-icon-plus"
|
||
@click="nr.bzs.push({})">
|
||
添加考核标准
|
||
</el-button>
|
||
|
||
<el-divider></el-divider>
|
||
</el-row>
|
||
|
||
</el-form-item>
|
||
|
||
|
||
</el-form>
|
||
</template>
|
||
|
||
|
||
<script>
|
||
|
||
const METHOD_NAME = "change"
|
||
|
||
module.exports = {
|
||
props: {
|
||
is_view: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
form_data: {
|
||
type: Object,
|
||
default: function() {
|
||
return {
|
||
nrs: [{
|
||
bzs: [{}],
|
||
auditUser: '',
|
||
}],
|
||
};
|
||
}
|
||
}
|
||
},
|
||
watch: {
|
||
formData: {
|
||
deep: true,
|
||
handler(val) {
|
||
this.$emit(METHOD_NAME, val)
|
||
}
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
isEvaluationIndex: false,
|
||
zbList: [],
|
||
formRules: {
|
||
xxx: [{required: true, message: '请填写年度', trigger: ['blur', 'change']}],
|
||
},
|
||
pickerOptions: {
|
||
disabledDate(time) {
|
||
return (
|
||
time.getFullYear() > new Date().getFullYear()
|
||
);
|
||
}
|
||
},
|
||
relationData:[
|
||
{moduleName:'提案系统模块',id:'proposal'},
|
||
{moduleName:'二级教代会',id:'secteameet'},
|
||
{moduleName:'慰问/补助',id:'ConandDif'},
|
||
],
|
||
formData:{},
|
||
userOptions: [],
|
||
}
|
||
},
|
||
methods: {
|
||
async selectUser(query) {
|
||
if (query) {
|
||
this.userOptions = []
|
||
this.userOptions = await this.getUserList(query)
|
||
}
|
||
},
|
||
async getUserList(query) {
|
||
const resp = await this.$axios.post("/platform/ghkh/Xjkhzb/getUserByKeyWord", {
|
||
keyWord: query,
|
||
})
|
||
return resp.data
|
||
},
|
||
async getByZbData() {
|
||
this.$axios.post('/platform/ghkh/khzb/edit', {id: this.formData.zbId}).then(res => {
|
||
if (res.code === 0) {
|
||
this.$set(this.formData, "nrs", res.data.nrs)
|
||
}
|
||
})
|
||
},
|
||
async getZbList() {
|
||
this.$axios.post("/platform/ghkh/Xjkhzb/getZbList").then(res => {
|
||
if (res.code === 0) {
|
||
this.zbList = res.data
|
||
}
|
||
})
|
||
},
|
||
async getKh() {
|
||
this.$axios.post("/platform/ghkh/khph/getKh", {"annual": this.formData.annual}).then(res => {
|
||
if (res.code === 0) {
|
||
if (res.data.length != 0) {
|
||
this.kh = res.data
|
||
this.data.khid = this.kh[0].id
|
||
} else {
|
||
this.kh = []
|
||
this.pageForm.khid = ""
|
||
}
|
||
}
|
||
})
|
||
},
|
||
async khSearch() {
|
||
await this.getKh()
|
||
},
|
||
getSummaries(param) {
|
||
const {columns, data} = param;
|
||
const sums = [];
|
||
columns.forEach((column, index) => {
|
||
if (index === 0) {
|
||
sums[index] = '小计';
|
||
return;
|
||
} else if ([1,4,5,6,7].includes(index)) {
|
||
sums[index] = '';
|
||
return;
|
||
}
|
||
const values = data.map(item => Number(item[column.property]));
|
||
if (!values.every(value => isNaN(value))) {
|
||
sums[index] = values.reduce((prev, curr) => {
|
||
const value = Number(curr);
|
||
if (!isNaN(value)) {
|
||
return prev + curr;
|
||
} else {
|
||
return prev;
|
||
}
|
||
}, 0);
|
||
sums[index] += ' 分';
|
||
} else {
|
||
sums[index] = '';
|
||
}
|
||
});
|
||
return sums;
|
||
}
|
||
},
|
||
async created() {
|
||
this.getZbList()
|
||
if (!this.form_data || !Object.keys(this.form_data).length) {
|
||
this.formData = {
|
||
nrs: [{
|
||
bzs: [{}],
|
||
auditUser: '',
|
||
}],
|
||
}
|
||
} else {
|
||
this.formData = this.form_data
|
||
// 初始化时间范围数据用于编辑
|
||
if (this.formData.startDateTime && this.formData.endDateTime) {
|
||
this.$set(this.formData, 'fillTimeRange', [this.formData.startDateTime, this.formData.endDateTime]);
|
||
}
|
||
if (this.formData.startApplyTime && this.formData.endApplyTime) {
|
||
this.$set(this.formData, 'appealTimeRange', [this.formData.startApplyTime, this.formData.endApplyTime]);
|
||
}
|
||
// 回显审核人
|
||
if (this.formData.nrs.length > 0) {
|
||
const users = [...new Set(
|
||
this.formData.nrs
|
||
.map(o => o.auditUser)
|
||
.filter(o => o != null && o !== '')
|
||
)]
|
||
let array = []
|
||
for (const o of users) {
|
||
array = array.concat(await this.getUserList(o))
|
||
}
|
||
this.userOptions = array
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.fixedBox {
|
||
position: fixed;
|
||
top: 200px;
|
||
right: 10px;
|
||
z-index: 100;
|
||
}
|
||
|
||
.el-divider {
|
||
background-color: #409EFF;
|
||
}
|
||
|
||
.el_form {
|
||
position: relative;
|
||
}
|
||
|
||
.el-input-group__prepend {
|
||
background-color: #419BF8;
|
||
color: white;
|
||
}
|
||
|
||
.el-descriptions-item__content {
|
||
width: 300px;
|
||
min-width: 300px;
|
||
}
|
||
|
||
.el-descriptions-item__label.is-bordered-label {
|
||
width: 100px;
|
||
}
|
||
|
||
</style>
|