yxk-20260508-党委会列表点击直接查询反馈子表信息样式调试
This commit is contained in:
@@ -5,6 +5,12 @@ import { render } from '/@/utils/common/renderUtils';
|
||||
import { getWeekMonthQuarterYear } from '/@/utils';
|
||||
//列表数据
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '序号',
|
||||
align:"center",
|
||||
dataIndex: 'number',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '督办次数',
|
||||
align:"center",
|
||||
@@ -22,11 +28,7 @@ export const columns: BasicColumn[] = [
|
||||
dataIndex: 'year',
|
||||
width: '60px',
|
||||
},
|
||||
{
|
||||
title: '序号',
|
||||
align:"center",
|
||||
dataIndex: 'number'
|
||||
},
|
||||
|
||||
{
|
||||
title: '会议时间',
|
||||
align:"center",
|
||||
@@ -35,6 +37,7 @@ export const columns: BasicColumn[] = [
|
||||
text = !text ? "" : (text.length > 10 ? text.substr(0,10) : text);
|
||||
return text;
|
||||
},
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '会议决议',
|
||||
@@ -110,21 +113,21 @@ export const columns: BasicColumn[] = [
|
||||
|
||||
//子表列表数据
|
||||
export const bgPartymatterFeedbackColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '责任部门id',
|
||||
align:"center",
|
||||
dataIndex: 'responDeptid'
|
||||
},
|
||||
// {
|
||||
// title: '责任部门id',
|
||||
// align:"center",
|
||||
// dataIndex: 'responDeptid'
|
||||
// },
|
||||
{
|
||||
title: '责任部门名称',
|
||||
align:"center",
|
||||
dataIndex: 'responDeptname'
|
||||
},
|
||||
{
|
||||
title: '反馈人id',
|
||||
align:"center",
|
||||
dataIndex: 'responPersonid'
|
||||
},
|
||||
// {
|
||||
// title: '反馈人id',
|
||||
// align:"center",
|
||||
// dataIndex: 'responPersonid'
|
||||
// },
|
||||
{
|
||||
title: '反馈人姓名',
|
||||
align:"center",
|
||||
@@ -145,11 +148,11 @@ export const bgPartymatterFeedbackColumns: BasicColumn[] = [
|
||||
align:"center",
|
||||
dataIndex: 'bpmStatus'
|
||||
},
|
||||
{
|
||||
title: '外键',
|
||||
align:"center",
|
||||
dataIndex: 'mainId'
|
||||
},
|
||||
// {
|
||||
// title: '外键',
|
||||
// align:"center",
|
||||
// dataIndex: 'mainId'
|
||||
// },
|
||||
];
|
||||
|
||||
// 高级查询数据
|
||||
|
||||
@@ -2,8 +2,29 @@
|
||||
<div class="p-2 erpNativeList">
|
||||
<!--查询区域-->
|
||||
<div class="jeecg-basic-table-form-container">
|
||||
<a-form ref="formRef" @keyup.enter.native="reload" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form ref="formRef" @keyup.enter="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-row :gutter="24">
|
||||
<a-col :lg="4" :md="6" :sm="8">
|
||||
<a-form-item label="年份" name="year">
|
||||
<JDictSelectTag v-model:value="queryParam.year" dictCode="super_year" placeholder="请选择年份" allow-clear @change="searchQuery" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="8" :sm="12">
|
||||
<a-form-item label="会议决议" name="content">
|
||||
<JInput v-model:value="queryParam.content" type="like" placeholder="请输入会议决议" allow-clear trim />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="7" :md="8" :sm="12">
|
||||
<a-form-item label="事项目录编码" name="matterCode">
|
||||
<JInput v-model:value="queryParam.matterCode" type="like" placeholder="请输入事项目录编码" allow-clear trim />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="8" :sm="12">
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
|
||||
<a-button preIcon="ant-design:reload-outlined" style="margin-left: 8px" @click="searchReset">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
@@ -13,22 +34,22 @@
|
||||
<!--插槽:table标题-->
|
||||
<template #tableTitle>
|
||||
<a-button type="primary" v-auth="'bgpartymatter:bg_partymatter:add'" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button>
|
||||
<a-button type="primary" v-auth="'bgpartymatter:bg_partymatter:exportXls'" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>
|
||||
<j-upload-button type="primary" v-auth="'bgpartymatter:bg_partymatter:importExcel'" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<a-menu-item key="1" @click="batchHandleDelete">
|
||||
<Icon icon="ant-design:delete-outlined"></Icon>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
<a-button v-auth="'bgpartymatter:bg_partymatter:deleteBatch'">
|
||||
批量操作
|
||||
<Icon icon="mdi:chevron-down"></Icon>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
<!-- <a-button type="primary" v-auth="'bgpartymatter:bg_partymatter:exportXls'" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button>-->
|
||||
<!-- <j-upload-button type="primary" v-auth="'bgpartymatter:bg_partymatter:importExcel'" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>-->
|
||||
<!-- <a-dropdown v-if="selectedRowKeys.length > 0">-->
|
||||
<!-- <template #overlay>-->
|
||||
<!-- <a-menu>-->
|
||||
<!-- <a-menu-item key="1" @click="batchHandleDelete">-->
|
||||
<!-- <Icon icon="ant-design:delete-outlined"></Icon>-->
|
||||
<!-- 删除-->
|
||||
<!-- </a-menu-item>-->
|
||||
<!-- </a-menu>-->
|
||||
<!-- </template>-->
|
||||
<!-- <a-button v-auth="'bgpartymatter:bg_partymatter:deleteBatch'">-->
|
||||
<!-- 批量操作-->
|
||||
<!-- <Icon icon="mdi:chevron-down"></Icon>-->
|
||||
<!-- </a-button>-->
|
||||
<!-- </a-dropdown>-->
|
||||
<!-- 高级查询 -->
|
||||
<super-query :config="superQueryConfig" @search="handleSuperQuery" />
|
||||
</template>
|
||||
@@ -42,7 +63,20 @@
|
||||
<!--嵌套子表-->
|
||||
<template #expandedRowRender="{ record }">
|
||||
<div class="feedback-expand-table">
|
||||
<div class="feedback-expand-header">
|
||||
<div class="feedback-expand-title">
|
||||
<span class="feedback-expand-icon">
|
||||
<Icon icon="ant-design:message-outlined" />
|
||||
</span>
|
||||
<span>反馈信息</span>
|
||||
<a-tag class="feedback-expand-count" color="processing">
|
||||
{{ getFeedbackTableLoading(record) ? '加载中' : `${getFeedbackCount(record)} 条` }}
|
||||
</a-tag>
|
||||
</div>
|
||||
<div class="feedback-expand-desc">当前事项的责任部门反馈记录</div>
|
||||
</div>
|
||||
<BasicTable
|
||||
class="feedback-inner-table"
|
||||
bordered
|
||||
size="small"
|
||||
rowKey="id"
|
||||
@@ -76,6 +110,9 @@
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { dateUtil } from '/@/utils/dateUtil';
|
||||
import { startProcessSchedules } from '/@/api/common/api';
|
||||
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
|
||||
import JInput from '/@/components/Form/src/jeecg/components/JInput.vue';
|
||||
import Icon from '/@/components/Icon/index';
|
||||
import BgPartymatterModal from './components/BgPartymatterModal.vue';
|
||||
import BusinessProcessListModal from '/src/components/semri/process/BusinessProcessListModal.vue';
|
||||
import FlowScheduleStartModal from '/src/components/semri/process/FlowScheduleStartModal.vue';
|
||||
@@ -117,18 +154,18 @@
|
||||
fixed:'right'
|
||||
},
|
||||
beforeFetch: async (params) => {
|
||||
return Object.assign(params, queryParam);
|
||||
return Object.assign(params, getQueryParams());
|
||||
},
|
||||
pagination: {
|
||||
current: 1,
|
||||
pageSize: 5,
|
||||
pageSizeOptions: ['5', '10', '20'],
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
},
|
||||
},
|
||||
exportConfig: {
|
||||
name:"党委会",
|
||||
url: getExportUrl,
|
||||
params: queryParam,
|
||||
params: getQueryParams,
|
||||
},
|
||||
importConfig: {
|
||||
url: getImportUrl,
|
||||
@@ -141,6 +178,46 @@
|
||||
// 高级查询配置
|
||||
const superQueryConfig = reactive(superQuerySchema);
|
||||
|
||||
/**
|
||||
* 判断查询值是否为空。
|
||||
* JInput 的 like 查询在输入为空时可能会生成 `**`,这里也按空值处理,避免传给后端形成无效模糊查询。
|
||||
*/
|
||||
function isEmptyQueryValue(value) {
|
||||
return value === undefined || value === null || value === '' || value === '**' || (Array.isArray(value) && value.length === 0);
|
||||
}
|
||||
|
||||
/**
|
||||
* 字符串查询值统一去除前后空格,非字符串值保持原样。
|
||||
*/
|
||||
function getTrimmedQueryValue(value) {
|
||||
return typeof value === 'string' ? value.trim() : value;
|
||||
}
|
||||
|
||||
/**
|
||||
* 生成最终提交给列表接口的查询参数。
|
||||
* 会过滤空值、纯空值以及 JInput 空模糊值,保留 JInput 已生成好的 like 查询格式。
|
||||
*/
|
||||
function getQueryParams() {
|
||||
const params: Recordable = {};
|
||||
Object.keys(queryParam).forEach((key) => {
|
||||
const value = getTrimmedQueryValue(queryParam[key]);
|
||||
if (!isEmptyQueryValue(value)) {
|
||||
params[key] = value;
|
||||
}
|
||||
});
|
||||
return params;
|
||||
}
|
||||
|
||||
/**
|
||||
* 清空查询条件。
|
||||
* 通过删除 reactive 对象中的字段,让查询表单和实际请求参数都恢复为空。
|
||||
*/
|
||||
function clearQueryParams() {
|
||||
Object.keys(queryParam).forEach((key) => {
|
||||
delete queryParam[key];
|
||||
});
|
||||
}
|
||||
|
||||
function getFeedbackKey(record: Recordable) {
|
||||
return String(record?.id ?? '');
|
||||
}
|
||||
@@ -149,6 +226,10 @@
|
||||
return feedbackTableData[getFeedbackKey(record)] || [];
|
||||
}
|
||||
|
||||
function getFeedbackCount(record: Recordable) {
|
||||
return getFeedbackTableData(record).length;
|
||||
}
|
||||
|
||||
function getFeedbackTableLoading(record: Recordable) {
|
||||
return !!feedbackTableLoading[getFeedbackKey(record)];
|
||||
}
|
||||
@@ -201,8 +282,12 @@
|
||||
Object.keys(params).map((k) => {
|
||||
queryParam[k] = params[k];
|
||||
});
|
||||
searchQuery();
|
||||
}
|
||||
|
||||
function searchQuery() {
|
||||
resetFeedbackExpand();
|
||||
reload();
|
||||
reload({ page: 1 });
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -397,11 +482,12 @@
|
||||
* 重置
|
||||
*/
|
||||
function searchReset() {
|
||||
formRef.value.resetFields();
|
||||
formRef.value?.resetFields();
|
||||
clearQueryParams();
|
||||
selectedRowKeys.value = [];
|
||||
resetFeedbackExpand();
|
||||
//刷新数据
|
||||
reload();
|
||||
reload({ page: 1 });
|
||||
}
|
||||
|
||||
|
||||
@@ -454,12 +540,77 @@
|
||||
}
|
||||
|
||||
.feedback-expand-table {
|
||||
padding: 8px 16px 12px;
|
||||
background: #fafafa;
|
||||
margin: 4px 10px 12px 42px;
|
||||
padding: 12px 14px 14px;
|
||||
background: #f6fbff;
|
||||
border: 1px solid #d6e8ff;
|
||||
border-left: 4px solid #1677ff;
|
||||
border-radius: 6px;
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
|
||||
|
||||
.feedback-expand-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.feedback-expand-title {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
color: #1f2937;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.feedback-expand-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 8px;
|
||||
color: #1677ff;
|
||||
background: #e6f4ff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.feedback-expand-count {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.feedback-expand-desc {
|
||||
color: #64748b;
|
||||
font-size: 13px;
|
||||
line-height: 22px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:deep(.jeecg-basic-table) {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
:deep(.feedback-inner-table .ant-table-wrapper) {
|
||||
padding: 0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
:deep(.feedback-inner-table .ant-table-thead > tr > th) {
|
||||
background: #eef6ff;
|
||||
color: #334155;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
:deep(.feedback-inner-table .ant-table-tbody > tr > td) {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
:deep(.feedback-inner-table .ant-table-tbody > tr:hover > td) {
|
||||
background: #f8fbff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user