CC/ruoyi-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
Leo
2026-01-06 01:08:28 +08:00
parent b38633ff49
commit f79535622a
1 changed files with 163 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
src/views/system/jdorder/orderList.vue
View File

@@ -124,9 +124,9 @@
<!-- 业务信息列 -->
<el-table-column label="标记" prop="distributionMark" width="100"/>
<el-table-column label="型号" prop="modelNumber" width="160"/>
<el-table-column label="地址" prop="address" min-width="280" show-overflow-tooltip>
<el-table-column label="地址" prop="address" min-width="280" show-overflow-tooltip class-name="address-cell">
<template slot-scope="scope">
<span style="font-weight: bold;">{{ scope.row.address }}</span>
<span style="font-weight: bold; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">{{ scope.row.address }}</span>
</template>
</el-table-column>
@@ -288,95 +288,107 @@
</el-dropdown>
</div>
<!-- 桌面端：正常显示所有按钮 -->
<div v-else style="display: flex; flex-wrap: wrap; gap: 4px; justify-content: center;">
<!-- 复制操作 -->
<el-button
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.orderId)"
title="复制订单号">
订单号
</el-button>
<el-button
v-if="scope.row.thirdPartyOrderNo"
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.thirdPartyOrderNo)"
title="复制第三方单号">
第三方
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.address)"
title="复制地址">
地址
</el-button>
<el-button
v-if="scope.row.logisticsLink"
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.logisticsLink)"
title="复制物流链接">
物流
</el-button>
<!-- 业务操作 -->
<el-button
type="text"
size="mini"
@click="copyReturnInfo(scope.row)"
title="复制退货信息">
退货复制
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-document-copy"
@click="copySingleOrderExcelText(scope.row)"
:style="isExcelTextCopied(scope.row.id) ? 'color: #67C23A;' : ''"
:title="isExcelTextCopied(scope.row.id) ? '已复制录单格式（Excel可粘贴）' : '复制录单格式（Excel可粘贴）'">
录单格式
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-document-copy"
@click="copyRebateRecordText(scope.row)"
title="复制后返录表格式（Excel可粘贴）">
后返录表
</el-button>
<el-button
type="text"
size="mini"
style="color: #67C23A;"
@click="handleFetchLogistics(scope.row)"
:title="scope.row.distributionMark">
获取物流
</el-button>
<!-- 统计开关 -->
<el-switch
v-model="scope.row.isCountEnabled"
:active-value="1"
:inactive-value="0"
@change="handleCountEnabledChange(scope.row)"
active-text="统计"
inactive-text=""
style="margin-left: 4px;">
</el-switch>
<!-- 删除操作 -->
<el-button
type="text"
size="mini"
style="color: #f56c6c;"
@click="handleDelete(scope.row)"
title="删除订单">
删除
</el-button>
<!-- 桌面端：优化后的按钮布局 -->
<div v-else class="desktop-action-buttons-wrapper">
<!-- 主要操作按钮（第一行） -->
<div class="action-row-primary">
<el-button
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.orderId)"
title="复制订单号">
订单号
</el-button>
<el-button
v-if="scope.row.thirdPartyOrderNo"
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.thirdPartyOrderNo)"
title="复制第三方单号">
第三方
</el-button>
<el-button
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.address)"
title="复制地址">
地址
</el-button>
<el-button
v-if="scope.row.logisticsLink"
type="text"
size="mini"
icon="el-icon-copy-document"
@click="copyToClipboard(scope.row.logisticsLink)"
title="复制物流链接">
物流
</el-button>
<el-button
type="text"
size="mini"
style="color: #67C23A;"
@click="handleFetchLogistics(scope.row)"
:title="scope.row.distributionMark">
获取物流
</el-button>
</div>
<!-- 次要操作按钮（第二行，使用下拉菜单） -->
<div class="action-row-secondary">
<el-dropdown
trigger="hover"
placement="bottom-end"
@command="handleActionCommand"
size="small">
<el-button
type="text"
size="mini"
icon="el-icon-more">
更多操作<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown" class="desktop-action-dropdown">
<el-dropdown-item
:command="{action: 'copyReturn', row: scope.row}"
icon="el-icon-document-copy">
退货复制
</el-dropdown-item>
<el-dropdown-item
:command="{action: 'copyExcel', row: scope.row}"
icon="el-icon-document-copy"
:class="{'is-copied': isExcelTextCopied(scope.row.id)}">
{{ isExcelTextCopied(scope.row.id) ? '✓ 录单格式（已复制）' : '录单格式' }}
</el-dropdown-item>
<el-dropdown-item
:command="{action: 'copyRebate', row: scope.row}"
icon="el-icon-document-copy">
后返录表
</el-dropdown-item>
<el-dropdown-item divided>
<div style="display: flex; align-items: center; justify-content: space-between; padding: 0 10px;">
<span>统计</span>
<el-switch
v-model="scope.row.isCountEnabled"
:active-value="1"
:inactive-value="0"
@change="handleCountEnabledChange(scope.row)"
size="mini"
style="margin-left: 10px;">
</el-switch>
</div>
</el-dropdown-item>
<el-dropdown-item
:command="{action: 'delete', row: scope.row}"
icon="el-icon-delete"
divided
style="color: #f56c6c;">
删除
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
</template>
</el-table-column>
@@ -1825,6 +1837,14 @@ export default {
padding: 8px 0;
}
/* 优化地址列显示，防止过长换行 */
.order-table ::v-deep .el-table .address-cell {
max-width: 280px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.order-table ::v-deep .el-table th {
padding: 10px 0;
background-color: #fafafa;
@@ -1888,24 +1908,73 @@ export default {
}
}
/* 桌面端操作按钮优化布局 */
.desktop-action-buttons-wrapper {
display: flex;
flex-direction: column;
gap: 6px;
align-items: center;
min-width: 200px;
}
.desktop-action-buttons-wrapper .action-row-primary {
display: flex;
flex-wrap: wrap;
gap: 4px;
justify-content: center;
align-items: center;
}
.desktop-action-buttons-wrapper .action-row-secondary {
display: flex;
justify-content: center;
align-items: center;
}
.desktop-action-buttons-wrapper .el-button {
padding: 5px 8px;
font-size: 12px;
white-space: nowrap;
}
/* 桌面端下拉菜单样式 */
::v-deep .desktop-action-dropdown {
min-width: 160px;
}
::v-deep .desktop-action-dropdown .el-dropdown-menu__item {
padding: 10px 20px;
font-size: 13px;
}
::v-deep .desktop-action-dropdown .el-dropdown-menu__item.is-copied {
color: #67C23A;
}
/* 桌面端确保操作列正常显示 */
@media (min-width: 769px) {
.order-table ::v-deep .action-column {
width: 280px !important;
width: 220px !important;
}
.order-table ::v-deep .el-table__fixed-right {
width: 280px !important;
width: 220px !important;
}
.order-table ::v-deep .el-table__fixed-right-patch {
width: 280px !important;
width: 220px !important;
}
/* 隐藏移动端按钮 */
.mobile-action-wrapper {
display: none !important;
}
/* 优化表格单元格高度 */
.order-table ::v-deep .action-column .cell {
padding: 8px 4px;
line-height: 1.4;
}
}
/* 操作按钮区域 */