<template>
<div>
<header class="ant-layout-header header_sd-header_common">
<div class="left_sd-header_common">
<div class="logo_sd-webflow_webflow">
<h3>激励考核指下发</h3>
</div>
</div>
<div class="right_sd-header_common">
<a-button
v-if="!
readonly"
type="link"
icon="save"
class="button_sd-webflow-button_webflow"
@click="save"
>
保存
</a-button>
<a-button
v-if="!
readonly"
type="link"
icon="save"
class="button_sd-webflow-button_webflow"
@click="xfClick"
>
下发
</a-button>
<a-button
type="link"
icon="close-circle"
class="button_sd-webflow-button_webflow"
@click="btnClose"
>
退出
</a-button>
</div>
</header>
<div class="budget-record">
<div class="budget-record-table">
<h2 class="budget-record-table-title">激励考核指下发</h2>
<a-form-model
ref="ruleForm"
:rules="rules"
:model="project"
class="sitd-apply"
layout="horizontal"
>
<table>
<colgroup>
<col width="170px" />
<col />
<col width="170px" />
<col />
</colgroup>
<tr>
<td class="ant-form-item-label cell_sd-form-item-td-label_common">
<label title="指标编号">指标编号</label>
</td>
<td class="ant-form-item-control-wrapper" :colspan="3">
<a-form-model-item prop="zbbh">
<template>{{ project['zbbh'] }}</template>
</a-form-model-item>
</td>
</tr>
<tr>
<td class="ant-form-item-label cell_sd-form-item-td-label_common">
<label title="指标年度" class="ant-form-item-required">指标年度</label>
</td>
<td class="ant-form-item-control-wrapper">
<a-form-model-item prop="zbnd">
<!-- 修改为下拉选择框 -->
<a-select
v-if="!
readonly"
v-model="project['zbnd']"
placeholder="请选择年份"
style="width: 100%"
>
<!-- 生成年份选项 -->
<a-select-option v-for="year in yearOptions" :key="year" :value="year">
{{ year }}
</a-select-option>
</a-select>
<template v-else>
{{ project['zbnd'] }}
</template>
</a-form-model-item>
</td>
<td class="ant-form-item-label cell_sd-form-item-td-label_common">
<label title="考核周期">考核周期</label>
</td>
<td class="ant-form-item-control-wrapper">
<a-form-model-item prop="khzq">
<a-input v-if="!
readonly" v-model="project['khzq']" placeholder="考核周期" />
<template v-else>{{ project['khzq'] }}</template>
</a-form-model-item>
</td>
</tr>
<tr>
<td class="ant-form-item-label cell_sd-form-item-td-label_common">
<label title="考核对象">考核对象</label>
</td>
<td class="ant-form-item-control-wrapper">
<a-form-model-item prop="khdx">
<a-select
v-if="!
readonly"
v-model="selectedKhdxIds"
mode="multiple"
style="width: 100%"
placeholder="请选择被考核对象"
@change="handleKhdxChange"
>
<template v-for="(item, _i) in khdxList">
<a-select-option :key="item.code" :value="item.code">{{
item.value
}}</a-select-option>
</template>
</a-select>
<template v-else>{{ project['khdx'] }}</template>
</a-form-model-item>
</td>
<td class="ant-form-item-label cell_sd-form-item-td-label_common">
<label title="创建日期" class="ant-form-item-required">创建日期</label>
</td>
<td class="ant-form-item-control-wrapper">
<a-form-model-item prop="cjrq">
<template>{{ project['cjrq'] ? refreshTime(project['cjrq']) : '' }}</template>
</a-form-model-item>
</td>
</tr>
<tr>
<td class="ant-form-item-label cell_sd-form-item-td-label_common upload-td">
<label title="说明">说明</label>
</td>
<td class="ant-form-item-control-wrapper" colspan="3">
<a-form-model-item prop="sm">
<div v-if="!
readonly" class="text
area-wrapper">
<a-text
area
v-model="project['sm']"
placeholder="请输入内容"
:max-length="300"
class="m-text
area"
:auto-size="{ minRows: 3, maxRows: 5 }"
/>
<span class="m-count">{{ `${project['sm']?.length || 0}/300` }}</span>
</div>
<template v-else>{{ project['sm'] }}</template>
</a-form-model-item>
</td>
</tr>
</table>
</a-form-model>
<!-- 这里暂时去掉，根据客户描述，一年只进行一次年度考核和激励考核，因此根据年度和单位关联即可 -->
<!-- <h3 class="budget-record-table-title">关联年度考核</h3>
<a-button
v-if="!
readonly"
type="primary"
:style="{ marginLeft: '88px' }"
class="button_sd-webflow-button_webflow"
@click="openDialogGl"
>
关联年度考核
</a-button>
<a-button
v-if="!
readonly"
:style="{ marginLeft: '8px' }"
class="button_sd-webflow-button_webflow"
:
disabled="!ndkhSelectedRowKeys.length"
@click="ndkhBeforDelete"
>
删除
</a-button>
<a-modal
title="选择年度考核"
:
visible="dialog
VisibleGl"
width="80%"
@ok="handleDialogConfirm"
@cancel="dialog
VisibleGl = false"
>
<div class="apply-search">
<a-form-model :form="searchForm" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }">
<a-row :gutter="24">
<a-col :span="8" class="chd">
<a-form-model-item label="考核年度">
<a-input
v-model="searchForm['khnd']"
allow-clear
placeholder="请输入指标年度"
/>
</a-form-model-item>
</a-col>
<a-col :span="8" class="chd">
<a-form-model-item label="考核周期">
<a-input
v-model="searchForm['khzq']"
allow-clear
placeholder="请输入考核周期"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="24" class="chd" :style="{ textAlign: 'right', lineHeight: '45px' }">
<a-button :style="{ marginRight: '8px' }" @click="reset"> 重置 </a-button>
<a-button type="primary" html-type="submit" @click="btnSearchBusinessList">
查询
</a-button>
</a-col>
</a-row>
</a-form-model>
</div>
<a-divider style="margin: 12px 0" />
<SdTable
ref="ndkh"
row-key="id"
:columns="ndkhColumns"
:data-source.sync="dialogResult"
:pagination="paginationOpt"
:loading="dialogLoading"
:scroll="{ x: 1500 }"
:row-selection="{
selectedRowKeys: selectedRowKeysAdd,
onChange: btnSelectProjectAdd,
}"
>
</SdTable>
</a-modal>
<SdTable
ref="ndkhTable"
row-key="id"
:columns="ndkhColumns"
:data-source.sync="ndkhResult"
:loading="ndkhLoading"
:pagination="false"
class="ant-table"
:row-selection="{
selectedRowKeys: ndkhSelectedRowKeys,
onChange: btnSelectProjectNdkh,
}"
>
</SdTable>
-->
<h3 class="budget-record-table-title" style="margin-top: 18px">激励考核指标</h3>
<a-button
v-if="!
readonly"
type="primary"
:style="{ marginLeft: '88px' }"
class="button_sd-webflow-button_webflow"
@click="openDialog"
>
新增
</a-button>
<a-button
v-if="!
readonly"
:style="{ marginLeft: '8px' }"
class="button_sd-webflow-button_webflow"
:
disabled="!selectedRowKeys.length"
@click="btnBeforDelete"
>
删除
</a-button>
<SdTable
ref="jlkhzbxf"
row-key="id"
:columns="jlkhzbxfColumns"
:data-source.sync="jlkhzbxfResult"
:loading="loading"
:pagination="false"
class="ant-table"
bordered
:row-selection="{
selectedRowKeys: selectedRowKeys,
onChange: btnSelectProject,
}"
>
<!-- 指标内容列自定义渲染 -->
<template slot="指标内容" slot-scope="text, record, index">
<div style="white-space: pre-line; text-align: left; padding: 8px 0">
{{ text }}
</div>
</template>
<template slot="分值" slot-scope="text, record, index">
<div style="white-space: pre-line; text-align: left; padding: 8px 0">
{{ text }}
</div>
</template>
<!-- 操作列 -->
<template v-if="!
readonly" slot="操作" slot-scope="text, record">
<a-button
class="action-button"
type="link"
size="small"
@click="btnOpenProjectDetails(record)"
>
编辑
</a-button>
</template>
</SdTable>
<a-modal
title="激励考核指标"
:
visible="dialog
Visible"
width="35%"
@ok="handleConfirm"
@cancel="handleCancel"
>
<div class="apply-search">
<a-form-model
ref="subFormRef"
:rules="jlkhzbxfSubRules"
:form="jlkhzbxfSubForm"
:label-col="{ span: 8 }"
:wrapper-col="{ span: 16 }"
>
<a-row>
<a-col :span="18">
<a-form-model-item label="指标类别">
<a-input
v-model="jlkhzbxfSubForm['zblb']"
allow-clear
placeholder="请输入指标类别"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="18">
<a-form-model-item label="指标内容">
<a-text
area
v-model="jlkhzbxfSubForm['zbnr']"
placeholder="请输入指标内容（按Enter换行）"
:max-length="300"
class="m-text
area"
:auto-size="{ minRows: 3, maxRows: 6 }"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="18">
<a-form-model-item label="分值">
<a-text
area
v-model="jlkhzbxfSubForm['fz']"
placeholder="请输入分值（按Enter换行）"
:max-length="300"
class="m-text
area"
:auto-size="{ minRows: 2, maxRows: 4 }"
/>
</a-form-model-item>
</a-col>
</a-row>
<a-row>
<a-col :span="18">
<a-form-model-item label="分值上限">
<a-input
v-model="jlkhzbxfSubForm['fzsx']"
allow-clear
placeholder='例如："+1分"、"-1.5分"或"不设上限"'
/>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</div>
</a-modal>
</div>
</div>
</div>
</template>
<script>
import { Message, Modal } from 'ant-design-vue'
import moment from 'moment'
import components from './_import-components/zk-jlkh-zbxf-import'
import KhypjService from './khypj-service'
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import SdTable from '@/common/components/sd-table.vue'
export default {
name: 'ZkJlkhZbxf',
metaInfo: {
title: '激励考核指标下发',
},
components: {
...components,
SdTable,
},
props: {
id: {
type: String,
default: undefined,
},
},
data() {
// 添加校验规则
const validateFzsx = (rule, value, callback) => {
if (!value) {
callback()
return
}
// 允许"不设上限"
if (value === '不设上限') {
callback()
return
}
// 验证格式: ±数字(可含小数) + 单位(非数字字符)
const regex = /^[+-]\d+(\.\d+)?[^\d]+$/
if (!regex.test(value)) {
callback(new Error('格式错误，请填写"不设上限"或类似"+1分"、"-1.5分"的格式'))
} else {
callback()
}
}
return {
loading: false,
ndkhLoading: false,
dialogLoading: false,
readonly: true,
yearOptions: this.generateYearOptions(),
rules: {
zbnd: [{ required: true, message: '请选择指标年度', trigger: 'blur' }],
},
jlkhzbxfSubRules: {
fzsx: [{ validator: validateFzsx, trigger: 'blur' }],
},
// 新增搜索表单数据
searchForm: {
khnd: undefined, // 考核年度
khzq: undefined, // 考核周期
},
project: {
id: undefined, // 主键id
zbbh: undefined, // 指标编号
cjrq: undefined, // 创建日期
zbnd: undefined, // 指标年度
khzq: undefined, // 考核周期
khdx: undefined, // 考核对象
khdxId: undefined, // 考核对象id
sm: undefined, // 说明
status: undefined, // 指标状态：0暂存，1下发（不可修改）
ndkhId: undefined, // 关联的年度考核id
},
jlkhzbxfResult: [],
jlkhzbxfSubForm: {
id: undefined, // id
mainId: undefined, // 主表id
zblb: undefined, // 指标类别
zbnr: undefined, // 指标内容
fz: undefined, // 分值
fzsx: undefined, // 分值上限
},
ndkhResult: [],
khdxList: [],
selectedKhdxIds: [], // 用于多选绑定的临时ID数组
dialog
Visible: false,
dialog
VisibleGl: false,
selectedKeys: [],
selectedRows: [],
selectedRowKeys: [],
ndkhSelectedRowKeys: [], // 年度考核表格的选中项
ndkhSelectedRows: [], // 年度考核表格选中的行数据
selectedKeysAdd: [],
selectedRowKeysAdd: [], // 年度考核表格的选中项
selectedRowsAdd: [], // 年度考核表格选中的行数据
isUpdateJlkhzbxfSub: false,
isXf: false,
ndkhColumns: [
{
title: '考核编号',
dataIndex: 'khbh',
scopedSlots: {
customRender: '考核编号',
},
width: '200px',
align: 'center',
},
{
title: '考核年度',
dataIndex: 'khnd',
scopedSlots: {
customRender: '指标年度',
},
width: '70px',
align: 'center',
},
{
title: '考核对象',
dataIndex: 'khdx',
scopedSlots: {
customRender: '责任主体',
},
width: '200px',
align: 'center',
},
{
title: '考核周期',
dataIndex: 'khzq',
scopedSlots: {
customRender: '考核周期',
},
width: '100px',
align: 'center',
},
],
dialogResult: [],
dialogColumns: [],
paginationOpt: {
current: 1, // 当前页码
pageSize: 10, // 当前每页大小
total: 0, // 总数
showSizeChanger: true,
showQuickJumper: false,
pageSizeOptions: ['10', '20', '40', '60', '80', '100'],
showTotal: (total) => `共 ${total} 条`,
onShowSizeChange: (current, pageSize) => {
this.paginationOpt.current = 1
this.paginationOpt.pageSize = pageSize
this.btnSearchBusinessList()
},
onChange: (current, size) => {
this.paginationOpt.current = current
this.paginationOpt.pageSize = size
this.btnSearchBusinessList()
},
},
}
},
computed: {
// 动态计算列配置
jlkhzbxfColumns() {
const baseColumns = [
{
title: '序号',
customRender: (text, record, index) => {
return index + 1
},
align: 'center',
width: '10%',
},
{
title: '指标类别',
dataIndex: 'zblb',
customRender: (text, record) => {
// 只有显示行才渲染内容
if (record.rowSpan > 0) {
return {
children: text,
attrs: { rowSpan: record.rowSpan },
}
}
return { attrs: { rowSpan: 0 } }
},
align: 'center',
width: '10%',
},
{
title: '指标内容',
dataIndex: 'zbnr',
scopedSlots: {
customRender: '指标内容',
},
align: 'center',
width: '40%',
},
{
title: '分值',
dataIndex: 'fz',
scopedSlots: {
customRender: '分值',
},
align: 'center',
width: '20%',
},
{
title: '分值上限',
dataIndex: 'fzsx',
scopedSlots: {
customRender: '分值上限',
},
align: 'center',
width: '10%',
},
]
// 非只读模式下添加操作列
if (!this.
readonly) {
baseColumns.push({
title: '操作',
dataIndex: 'action',
scopedSlots: { customRender: '操作' },
width: '10%',
align: 'center',
})
}
return baseColumns
},
},
watch: {
jlkhzbxfResult: {
handler(newVal) {
this.calculateRowSpans(newVal)
},
immediate: true, // 初始化时立即执行
deep: true, // 深度监听
},
},
c
reated() {
this.getKhdxList()
this.jlkhzbxfResult = this.calculateRowSpans(this.jlkhzbxfResult)
this.initJlkhzbxfInfo()
},
mounted() {
if (!this.$route.query.id) {
this.project.zbbh = this.getZBbh()
this.project.cjrq = moment(new Date()).format('YYYY-MM-DD')
this.
readonly = false
}
},
methods: {
// 年度考核表格选中处理
btnSelectProjectNdkh(selectedRowKeys, selectedRows) {
this.ndkhSelectedRowKeys = selectedRowKeys
this.ndkhSelectedRows = [...selectedRows]
},
btnSelectProjectAdd(selectedRowKeys, selectedRows) {
this.selectedRowKeysAdd = selectedRowKeys
this.selectedRowsAdd = [...selectedRows]
},
// 重置搜索表单
reset() {
this.searchForm = {
khnd: undefined, // 考核年度
khzq: undefined, // 考核周期
}
this.paginationOpt.current = 1
this.paginationOpt.pageSize = 10
this.btnSearchBusinessList()
},
getKhzbxfInfo() {
console.log('1111111----------', this.project)
console.log('22222222----------', this.project.ndkhId)
if (this.project.ndkhId) {
KhypjService.getKhzbxfById(this.project.ndkhId).then((res) => {
if (res.data.code === 200) {
if (res.data.data) {
this.ndkhResult.push(res.data.data)
} else {
this.ndkhResult = []
}
} else {
Message.error('获取考核指标下发信息失败！')
}
})
}
},
ndkhBeforDelete() {
const _this = this
if (_this.ndkhSelectedRowKeys.length === 0) {
Message.warning('请选择要删除的数据！')
return
}
Modal.confirm({
content: '是否确认删除？',
onOk() {
_this.project.ndkhId = '-1'
_this.saveJlkhzbxf()
_this.ndkhResult = []
_this.ndkhSelectedRowKeys = [] // 清空选中状态
},
onCancel() {},
})
},
openDialogGl() {
console.log('3333----------', this.ndkhResult)
if (this.ndkhResult.length > 0) {
Message.warning('只能关联一条年度考核!')
return
}
this.dialog
VisibleGl = true
this.selectedKeysAdd = []
this.selectedRowsAdd = []
this.btnSearchBusinessList()
},
handleDialogConfirm() {
if (this.selectedRowsAdd.length === 0) {
Message.warning('请选择一条年度考核!')
return
}
if (this.selectedRowsAdd.length > 1) {
Message.warning('只能关联一条年度考核!')
return
}
this.project.ndkhId = this.selectedRowsAdd[0].id
this.saveJlkhzbxf()
this.getKhzbxfInfo()
this.dialog
VisibleGl = false
},
btnSearchBusinessList() {
this.dialogLoading = true
const khzbxfSearchVo = {
khnd: this.searchForm.khnd,
khzq: this.searchForm.khzq,
}
const params = {
current: this.paginationOpt.current, // 直接使用当前页码
pageSize: this.paginationOpt.pageSize, // 直接使用当前每页大小
searchVo: khzbxfSearchVo,
}
KhypjService.getNdkhList(params)
.then((res) => {
if (res.data.code === 200) {
this.paginationOpt.total = res.data.data.total
this.dialogResult = res.data.data.records
} else {
Message.error('查询失败！')
}
})
.catch((err) => {
Message.error(err.message || err.data)
this.paginationOpt.total = 0
this.dialogResult = []
})
.finally(() => {
this.dialogLoading = false
})
},
getKhdxList() {
KhypjService.getCodeList('khdx').then((res) => {
if (res.data.code === 200) {
this.khdxList = res.data.data
} else {
Message.error('查询失败！')
}
})
},
// 处理考核对象选择变化
handleKhdxChange(selectedIds) {
// 1. 拼接ID字符串
this.project.khdxId = selectedIds.join('；')
// 2. 拼接名称字符串
const selectedNames = []
selectedIds.fo
rEach((code) => {
const item = this.khdxList.find((d) => d.code === code)
if (item) {
selectedNames.push(item.value)
}
})
this.project.khdx = selectedNames.join('；')
},
btnBeforDelete() {
const _this = this
if (this.selectedRowKeys.length === 0) {
Message.warning('请选择要删除的数据！')
return
}
Modal.confirm({
content: '是否确认删除？',
onOk() {
_this.deleteJlkhzbxfSub()
_this.selectedRowKeys = []
},
onCancel() {},
})
},
deleteJlkhzbxfSub() {
KhypjService.removeJlkhzbxfSubByIds(this.selectedRowKeys).then((res) => {
if (res.data.code === 200) {
Message.success('删除成功！')
this.getJlkhzbxfSubList()
} else {
Message.error('查询失败！')
}
})
},
btnSelectProject(selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = [...selectedRows]
},
openDialog() {
this.dialog
Visible = true
this.selectedKeys = []
this.selectedRows = []
this.jlkhzbxfSubForm = {
id: undefined, // id
mainId: this.$route.query.id, // 主表id
zblb: undefined, // 指标类别
zbnr: undefined, // 指标内容
fz: undefined, // 分值
fzsx: undefined, // 分值上限
}
// 新增子数据自动保存主数据
if (!this.$route.query.id) {
this.saveJlkhzbxf()
}
},
btnOpenProjectDetails(record) {
this.dialog
Visible = true
this.jlkhzbxfSubForm = {
id: record.id, // id
mainId: record.mainId, // 主表id
zblb: record.zblb, // 指标类别
zbnr: record.zbnr, // 指标内容
fz: record.fz, // 分值
fzsx: record.fzsx, // 分值上限
}
this.isUpdateJlkhzbxfSub = true
console.log('121212------', record)
console.log('33333222------', this.jlkhzbSubxfForm)
},
handleCancel() {
this.dialog
Visible = false
},
// 弹窗确认
handleConfirm() {
// 添加表单校验
this.$refs.subFormRef.validate((valid) => {
if (!valid) {
return false
}
// 原有的保存逻辑...
if (!this.isUpdateJlkhzbxfSub) {
this.jlkhzbxfSubForm.mainId = this.$route.query.id
// 保存子表数据
KhypjService.saveJlkhzbxfSub(this.jlkhzbxfSubForm).then((res) => {
if (res.data.code === 200) {
Message.success(`添加成功！`)
this.getJlkhzbxfSubList()
} else {
Message.error('添加失败！')
}
})
} else {
// 保存子表数据
KhypjService.updateJlkhzbxfSub(this.jlkhzbxfSubForm).then((res) => {
if (res.data.code === 200) {
Message.success(`修改成功！`)
this.getJlkhzbxfSubList()
} else {
Message.error('修改失败！')
}
})
this.isUpdateJlkhzbxfSub = false
}
this.dialog
Visible = false
})
},
// handleConfirm() {
// if (!this.isUpdateJlkhzbxfSub) {
// this.jlkhzbxfSubForm.mainId = this.$route.query.id
// // 保存子表数据
// KhypjService.saveJlkhzbxfSub(this.jlkhzbxfSubForm).then((res) => {
// if (res.data.code === 200) {
// Message.success(`添加成功！`)
// this.getJlkhzbxfSubList()
// } else {
// Message.error('添加失败！')
// }
// })
// } else {
// // 保存子表数据
// KhypjService.updateJlkhzbxfSub(this.jlkhzbxfSubForm).then((res) => {
// if (res.data.code === 200) {
// Message.success(`修改成功！`)
// this.getJlkhzbxfSubList()
// } else {
// Message.error('修改失败！')
// }
// })
// this.isUpdateJlkhzbxfSub = false
// }
// this.dialog
Visible = false
// },
// 计算行合并
calculateRowSpans(data) {
if (!data || data.length === 0) return data
const categoryMap = {}
// 第一步：统计每个类别的行数
data.fo
rEach((item) => {
categoryMap[item.zblb] = (categoryMap[item.zblb] || 0) + 1
})
// 第二步：设置行合并属性
let lastCategory = null
return data.map((item) => {
// 重置rowSpan属性
item.rowSpan = undefined
if (item.zblb !== lastCategory) {
lastCategory = item.zblb
// 只有每个类别的第一行设置rowSpan
item.rowSpan = categoryMap[item.zblb]
return item
}
// 同类别的后续行设置rowSpan为0
item.rowSpan = 0
return item
})
},
// 生成年份选项
generateYearOptions() {
const currentYear = new Date().getFullYear()
const years = []
// 添加年份：当前年后1年、本年、前1年、前2年
years.push(currentYear + 1) // 后1年
years.push(currentYear) // 本年
years.push(currentYear - 1) // 前1年
years.push(currentYear - 2) // 前2年
return years
},
btnClose() {
window.close()
},
initJlkhzbxfInfo() {
if (this.$route.query.id) {
KhypjService.getJlkhzbxfById(this.$route.query.id).then((res) => {
if (res.data.code === 200) {
this.project = res.data.data
this.project.cjrq = this.project.cjrq
? moment(new Date(this.project.cjrq)).format('YYYY-MM-DD')
: null
this.
readonly = this.project.status === 1
// 初始化选中项
if (this.project.khdxId) {
this.selectedKhdxIds = this.project.khdxId.split('；').filter(Boolean)
}
this.getJlkhzbxfSubList()
this.getKhzbxfInfo()
} else {
Message.error('获取考核指标库信息失败！')
}
})
}
},
save() {
const _this = this
this.$refs.ruleForm.validate((valid, obj) => {
if (!valid) {
Message.warning('请输入必填项！')
return false
} else {
_this.saveJlkhzbxf()
}
})
},
xfClick() {
this.
readonly = true
this.isXf = true
this.save()
KhypjService.jlkhzbzpXfStart(this.$route.query.id).then((res) => {
if (res.data.code === 200) {
Message.success('下发成功！')
} else {
Message.error('下发失败！')
}
})
},
// 修改 saveJlkhzbxf 方法返回 Promise
saveJlkhzbxf() {
const _this = this
if (this.isXf) {
this.project.status = 1
} else {
this.project.status = 0
}
// 创建数据副本，避免污染原始数据
const postData = { ...this.project }
// 仅在值是字符串时才进行转换
if (postData.cjrq && typeof postData.cjrq === 'string') {
postData.cjrq = this.strToTimestamp(postData.cjrq)
}
// 返回一个 Promise
return new Promise((resolve, reject) => {
// 判断是新增还是更新
const apiCall = !this.$route.query.id
? KhypjService.saveJlkhzbxf(postData)
: KhypjService.updateJlkhzbxf(postData)
apiCall
.then((res) => {
if (res.data.code === 200) {
// 处理新增保存成功
if (!_this.$route.query.id) {
Message.success('保存成功！')
if (res.data.data) {
const currentUrl = window.location.href
const newUrl = currentUrl.replace('zbxf', `zbxf?id=${res.data.data}`)
// 直接跳转页面，不需要等待初始化
window.location.href = newUrl
}
resolve() // 解析 Promise
}
// 处理更新保存成功
else {
if (_this.project.status === 1) {
Message.success('提交成功！')
} else {
Message.success('保存成功！')
}
resolve() // 解析 Promise
}
} else {
// 处理失败情况
const errorMessage = !_this.project.id
? '保存失败！'
: _this.project.status === 1
? '提交失败！'
: '保存失败！'
Message.error(errorMessage)
reject(new Error(res.data.message || errorMessage))
}
})
.catch((error) => {
// 处理 API 错误
const errorMessage = !_this.project.id
? '保存失败！'
: _this.project.status === 1
? '提交失败！'
: '保存失败！'
console.error('API 错误:', error)
Message.error(errorMessage)
reject(error)
})
})
},
getJlkhzbxfSubList() {
KhypjService.getJlkhzbxfSubList(this.$route.query.id).then((res) => {
if (res.data.code === 200) {
this.jlkhzbxfResult = res.data.data
} else {
Message.error('获取子表信息失败！')
}
})
},
// 获取唯一指标编号
getZBbh() {
// 获取当前时间
const now = new Date()
// 获取当前时间的年、月、日、时、分、秒、毫秒
const year = now.getFullYear()
const month = String(now.getMonth() + 1).padStart(2, '0')
const day = String(now.getDate()).padStart(2, '0')
const hour = String(now.getHours()).padStart(2, '0')
const minute = String(now.getMinutes()).padStart(2, '0')
const second = String(now.getSeconds()).padStart(2, '0')
const millisecond = String(now.getMilliseconds()).padStart(3, '0')
// 生成唯一标识
const uniqueId = `${year}${month}${day}${hour}${minute}${second}${millisecond}`
return 'JLKHZBXF-' + uniqueId
},
strToTimestamp(dateStr) {
const date = moment(dateStr, 'YYYY-MM-DD')
return date.valueOf()
},
refreshTime(item) {
return moment(item).format('YYYY-MM-DD')
},
},
}
</script>
<style lang="scss" scoped>
/* 设置表格宽度 */
.ant-table {
width: 90%;
margin: auto; /* 居中显示 */
}
.sitd-collapse-block {
width: 90%;
margin: auto;
&::v-deep(.ant-collapse-content-box) {
padding: unset !important;
}
}
table {
width: 90%;
margin: auto;
border-top: 1px solid #e8e8e8;
margin-bottom: 16px;
table-layout: fixed;
tr td {
border-left: 1px solid #e8e8e8;
border-bottom: 1px solid #e8e8e8;
min-height: 100px;
&:first-child {
border-left: unset;
}
&:nth-child(2n + 1) {
background: #fafafa;
width: 170px;
}
&.upload-td {
background: #fafafa;
width: 170px !important;
}
&.upload-time-td {
background: #fafafa;
width: 200px !important;
}
&.ant-form-item-check {
width: 194px !important;
}
.ant-form-item {
margin-bottom: unset !important;
padding: 5px;
.ant-form-item-label {
width: 170px;
padding-bottom: 1px;
text-align: center;
background-color: #fafafa;
}
}
&::v-deep(label) {
display: block;
margin: 0 auto;
text-align: right;
white-space: normal;
line-height: 20px;
padding: 0 5px;
}
.ant-form-item-prompt {
display: block;
margin: 0 auto;
text-align: right;
white-space: normal;
line-height: 20px;
padding: 0 14px 0 5px;
font-size: 16px;
color: rgba(0, 0, 0, 0.85);
}
.prompt-red {
color: #f5222d !important;
}
.ant-form-item-radio {
&::v-deep(label) {
display: inline !important;
}
}
&::v-deep(.ant-checkbox + span) {
padding-right: 0 !important;
}
}
::v-deep(.ant-form-item-control-wrapper) {
min-height: 40px;
}
}
.ant-form-long-label {
tr td {
&:nth-child(2n + 1) {
// width: 200px !important;
}
}
}
.ant-collapse {
border-top: 1px solid #d9d9d9;
border-bottom: unset;
border-left: unset;
border-right: unset;
width: 90%;
margin: auto;
& > .ant-collapse-item {
border-bottom: unset;
/*& > .ant-collapse-content{*/
/* border-top: 1px solid #d9d9d9;*/
/* border-bottom: 1px solid #d9d9d9;*/
/* border-radius: 4px;*/
/*}*/
&::v-deep(.ant-collapse-content) {
border-top: unset;
}
}
}
.text
area-wrapper {
position: relative;
display: block;
.m-text
area {
padding: 8px 12px;
height: 100%;
}
.m-count {
color: #808080;
background: #fff;
position: absolute;
font-size: 12px;
bottom: 12px;
right: 12px;
line-height: 16px;
}
}
.ant-spin-loading {
width: 100vw;
height: 100vh;
display: block;
background-color: rgba(0, 0, 0, 0.5);
position: fixed;
top: 0;
left: 0;
z-index: 99;
}
.apply-block {
display: flex;
align-items: center;
.dynamic-delete-button {
cursor: pointer;
position: relative;
font-size: 24px;
color: #999;
transition: all 0.3s;
}
.dynamic-delete-button:hover {
color: #777;
}
.dynamic-delete-button[
disabled] {
cursor: not-allowed;
opacity: 0.5;
}
div {
flex: 1;
}
}
.btn-group {
display: flex;
align-items: center;
justify-content: right;
width: 90%;
margin: 0 auto 20px;
button {
margin-left: 10px;
}
}
.ant-form-budget-border {
border-bottom: 1px solid #d9d9d9;
margin-left: -1px;
}
.budget-box {
height: 100%;
overflow: hidden;
display: flex;
flex: 1;
flex-direction: column;
}
.budget-record {
width: 100%;
height: 100%;
overflow: auto;
display: flex;
justify-content: center;
background: #fff;
}
.budget-record-table {
width: 90%; //调整页面表格宽度
// min-width: 840px;
padding: 16px;
}
.budget-record-table-title {
margin-bottom: 20px;
text-align: center;
white-space: pre-wrap;
}
.header_sd-header_common.ant-layout-header {
padding: 0 20px 0 20px;
color: #fff;
background-image: linear-gradient(90deg, #1890ff 0%, #0162eb 100%);
height: 64px;
line-height: 64px;
}
.header_sd-header_common {
z-index: 1;
}
.ant-layout-header {
background: #001529;
}
.ant-layout-header,
.ant-layout-footer {
flex: 0 0 auto;
}
header {
display: block;
}
.ant-layout,
.ant-layout * {
box-sizing: border-box;
}
.left_sd-header_common {
float: left;
height: 100%;
}
.right_sd-header_common {
float: right;
height: 100%;
}
.logo_sd-webflow_webflow h3 {
color: #fff;
}
.header_sd-header_common .ant-btn-link {
color: #fff;
}
.button_sd-webflow-button_webflow {
max-width: 100%;
}
</style>
检查代码，针对分值上限设置的校验规则并未生效，请检查代码并修改
本文详细对比了CSS属性display:none与visibility:hidden的区别，包括SEO影响与JS交互的不同；并介绍了HTML属性readonly与disabled的差异，涉及表单提交行为、用户交互等方面。
扫一扫
571
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
