diff --git a/src/views/system/jd-instruction/index.vue b/src/views/system/jd-instruction/index.vue
index 89b6118..464bcba 100644
--- a/src/views/system/jd-instruction/index.vue
+++ b/src/views/system/jd-instruction/index.vue
@@ -13,16 +13,15 @@
执行
清空
慢单
- 腾峰
- 生
+ 通用格式
- 腾峰
- 凡
- 纹
- 鸿
- 拼多多
- 拼多多-纹
+ 腾峰
+ 凡
+
+ 鸿
+ 拼多多
+
@@ -741,32 +740,33 @@ export default {
margin-right: 0;
}
-/* 移动端按钮优化 */
+/* 移动端按钮优化 - 每行显示4个按钮 */
@media (max-width: 768px) {
.button-group {
- gap: 8px;
+ gap: 6px;
margin-bottom: 12px;
display: grid !important;
width: 100% !important;
+ grid-template-columns: repeat(4, 1fr) !important;
}
.button-group .el-button {
- padding: 12px 8px;
- font-size: 13px;
- height: 44px; /* 增大触摸目标 */
+ padding: 8px 4px;
+ font-size: 12px;
+ height: 40px;
line-height: 1.2;
- width: 100% !important;
margin: 0 !important;
flex: none !important;
min-width: 0 !important;
max-width: 100% !important;
+ min-height: 40px;
}
- /* 移动端第一行按钮组(执行、清空、慢单、腾峰)- 每行2个,显示最常用的4个 */
+ /* 主按钮组:执行、清空、慢单、通用格式 - 一行4个 */
.button-group-primary {
display: grid !important;
- grid-template-columns: repeat(2, 1fr) !important;
- gap: 8px !important;
+ grid-template-columns: repeat(4, 1fr) !important;
+ gap: 6px !important;
width: 100% !important;
}
@@ -775,15 +775,18 @@ export default {
max-width: 100% !important;
}
- /* 移动端:将腾峰移到第一组,第二组隐藏 */
+ /* 次要按钮组:腾峰、凡、纹、鸿、拼多多、拼多多-纹 - 每行4个 */
.button-group-secondary {
- display: none !important;
+ display: grid !important;
+ grid-template-columns: repeat(4, 1fr) !important;
+ gap: 6px !important;
+ width: 100% !important;
}
.button-group-secondary .el-button {
width: 100% !important;
max-width: 100% !important;
- padding: 10px 4px;
+ padding: 8px 4px;
font-size: 12px;
}