refactor(payment): 统一搜索栏“展开/收起”按钮实现
- 取消 el-tooltip 包裹,改用纯 el-button 实现带图标的展开收起按钮 - 按 avue-crud 规范控制按钮显示,新增 searchIndex (默认 4)和 searchItemCount 控制逻辑 - 搜索项数量未超出 searchIndex 时隐藏展开收起按钮 - 相关组件支付模块多处应用此统一方案(bill-ledger-search、bill-payment-search、invoice-application、invoice-receipt、receipt-claim-record、receipt-flow) - 维护展开状态对应的箭头图标和文案为“收起”与“展开” refactor(business): 优化路线变更内容渲染与样式 - 替换旧的 formatRouteChangeContent 为更详细的 parseRouteChangeContent,支持多分组与字段显示 - 路线变更内容支持多层次分组、字段标签、改变前后值对比及未变更标识展示 - 取消全局列溢出提示以避免多行内容被截断,针对路线变更内容列显式禁用溢出提示并设置白色换行样式 - 在 business-crud-page、waybill-manage-page、loading-manage 相关页面和组件中统一应用该解析与渲染方案 refactor(option): 调整 measurement-unit 配置以提升表格列展示 - 移除 menuWidth 配置,采用 menuFixed 固定右侧模式 - 为创建人和更新人列添加 minWidth 110,时间列添加 width 180,避免内容被截断 - 表格列数组顺序调整,确保搜索与展示保持一致 refactor(payment & receipt-flow): 统一支付及回执模块工具栏和表格行为 - 按照统一规范和用户反馈,调整多处页面的搜索栏操作区和表格列配置 - 引入 TableHeaderTools 组件和相关状态传递,实现搜索显隐与表格尺寸切换统一 - 优化 avue-crud 表格组件的交互一致性和视觉表现 refactor(utils): 重构路线变更内容解析函数 - 新增 parseRouteChangeContent 以支持复杂路线变更文本的解析与分组 - 识别运单号、字段标签、变更前后值,支持多种箭头符号及调整描述 - 用法推广至相关业务页面,支持更加直观的路线变更展示界面
This commit is contained in:
@@ -41,11 +41,15 @@
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="receipt-flow-page__search-actions">
|
||||
<el-button @click="searchExpanded = !searchExpanded">
|
||||
{{ searchExpanded ? '折叠' : '展开' }}
|
||||
</el-button>
|
||||
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||||
<el-button @click="resetSearch">重置</el-button>
|
||||
<el-button
|
||||
v-if="showSearchToggle"
|
||||
text
|
||||
:icon="searchExpanded ? ArrowUp : ArrowDown"
|
||||
@click="searchExpanded = !searchExpanded"
|
||||
>{{ searchExpanded ? '收起' : '展开' }}</el-button
|
||||
>
|
||||
</div>
|
||||
</el-form>
|
||||
</section>
|
||||
@@ -200,6 +204,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
|
||||
import { mapGetters } from 'vuex';
|
||||
import * as api from '@/api/payment/receiptFlow';
|
||||
import { receiptFlowTableColumns } from '@/option/payment/receiptFlow';
|
||||
@@ -279,6 +284,8 @@ export default {
|
||||
components: { TableHeaderTools },
|
||||
data() {
|
||||
return {
|
||||
ArrowDown,
|
||||
ArrowUp,
|
||||
query: emptyQuery(),
|
||||
claimStatusOptions: api.claimStatusOptions,
|
||||
columns: receiptFlowTableColumns,
|
||||
@@ -290,6 +297,9 @@ export default {
|
||||
loading: false,
|
||||
syncing: false,
|
||||
searchExpanded: false,
|
||||
// 与 avue-crud 一致:搜索项数量超过 searchIndex(默认一行 4 项)时才显示“展开/收起”
|
||||
searchIndex: 4,
|
||||
searchItemCount: 7,
|
||||
page: { current: 1, size: 10, total: 0 },
|
||||
detailDialog: { visible: false, loading: false, data: {}, claimRecords: [] },
|
||||
};
|
||||
@@ -299,6 +309,9 @@ export default {
|
||||
visibleColumns() {
|
||||
return this.columns.filter(column => this.visibleColumnKeys.includes(column.prop));
|
||||
},
|
||||
showSearchToggle() {
|
||||
return this.searchItemCount > this.searchIndex;
|
||||
},
|
||||
isAdmin() {
|
||||
return isAdministrator(this.userInfo);
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user