1
This commit is contained in:
@@ -22,7 +22,7 @@
|
||||
import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
|
||||
import MobileBottomNav from '@/components/MobileBottomNav'
|
||||
import ResizeMixin from './mixin/ResizeHandler'
|
||||
import { mapState } from 'vuex'
|
||||
import { mapState, mapGetters } from 'vuex'
|
||||
import variables from '@/assets/styles/variables.scss'
|
||||
|
||||
export default {
|
||||
@@ -45,10 +45,87 @@ export default {
|
||||
needTagsView: state => state.settings.tagsView,
|
||||
fixedHeader: state => state.settings.fixedHeader
|
||||
}),
|
||||
...mapGetters(['sidebarRouters']),
|
||||
mobileNavItems() {
|
||||
// 可以从配置或store中获取,也可以自定义
|
||||
// 如果返回空数组,组件会使用默认逻辑
|
||||
return []
|
||||
// 根据业务需求配置底部导航项
|
||||
// 匹配关键词来自动查找路由,如果找不到则使用指定路径
|
||||
const navConfig = [
|
||||
{ keywords: ['慢单', 'sloworder'], label: '下好的慢单', icon: 'el-icon-list', defaultPath: '/sloworder/index' },
|
||||
{ keywords: ['指令', 'instruction', 'jd-instruction'], label: '指令执行', icon: 'el-icon-edit-outline', defaultPath: '/jd-instruction/index' },
|
||||
{ keywords: ['型号', 'productJdConfig', 'product'], label: '型号配置', icon: 'el-icon-setting', defaultPath: '/jarvis/productJdConfig' },
|
||||
{ keywords: ['商品', 'favorite', 'erpProduct'], label: '商品列表', icon: 'el-icon-goods', defaultPath: '/favorite/index' }
|
||||
]
|
||||
|
||||
const routes = this.sidebarRouters || []
|
||||
|
||||
// 扁平化路由
|
||||
const flattenRoutes = (routes, parentPath = '') => {
|
||||
let result = []
|
||||
if (!routes || !Array.isArray(routes)) return result
|
||||
|
||||
routes.forEach(route => {
|
||||
if (route.hidden) return
|
||||
|
||||
let fullPath = route.path || ''
|
||||
if (parentPath) {
|
||||
if (fullPath.startsWith('/')) {
|
||||
fullPath = fullPath
|
||||
} else {
|
||||
const basePath = parentPath.endsWith('/') ? parentPath.slice(0, -1) : parentPath
|
||||
fullPath = `${basePath}/${fullPath}`.replace(/\/+/g, '/')
|
||||
}
|
||||
}
|
||||
|
||||
if (!fullPath.startsWith('/')) {
|
||||
fullPath = '/' + fullPath
|
||||
}
|
||||
|
||||
if (route.children && route.children.length > 0) {
|
||||
result = result.concat(flattenRoutes(route.children, fullPath))
|
||||
} else {
|
||||
if (route.meta && route.meta.title && fullPath) {
|
||||
result.push({
|
||||
path: fullPath,
|
||||
label: route.meta.title,
|
||||
route: route
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
return result
|
||||
}
|
||||
|
||||
const flatRoutes = flattenRoutes(routes)
|
||||
|
||||
// 为每个配置项查找匹配的路由
|
||||
const navItems = navConfig.map(config => {
|
||||
// 先尝试从路由中匹配
|
||||
const matchedRoute = flatRoutes.find(route => {
|
||||
const path = (route.path || '').toLowerCase()
|
||||
const title = (route.label || '').toLowerCase()
|
||||
return config.keywords.some(keyword =>
|
||||
path.includes(keyword.toLowerCase()) || title.includes(keyword.toLowerCase())
|
||||
)
|
||||
})
|
||||
|
||||
if (matchedRoute) {
|
||||
return {
|
||||
path: matchedRoute.path,
|
||||
label: config.label,
|
||||
icon: config.icon
|
||||
}
|
||||
}
|
||||
|
||||
// 如果没找到,使用默认路径
|
||||
return {
|
||||
path: config.defaultPath,
|
||||
label: config.label,
|
||||
icon: config.icon
|
||||
}
|
||||
})
|
||||
|
||||
// 过滤掉无效的路由
|
||||
return navItems.filter(item => item.path)
|
||||
},
|
||||
classObj() {
|
||||
return {
|
||||
|
||||
@@ -9,20 +9,19 @@
|
||||
<el-form-item label="输入指令">
|
||||
<el-input v-model="form.command" type="textarea" :rows="8" placeholder="例如:京今日统计 / 京昨日订单 / 慢搜关键词 / 录单20250101-20250107" />
|
||||
</el-form-item>
|
||||
<el-form-item class="button-group">
|
||||
<el-form-item class="button-group button-group-primary">
|
||||
<el-button type="success" size="medium" @click="run" :loading="loading">执行</el-button>
|
||||
<el-button type="danger" size="medium" @click="clearAll">清空</el-button>
|
||||
<el-button size="warning" @click="fillMan">慢单</el-button>
|
||||
<el-button size="success" @click="fillSheng">生</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item class="button-group">
|
||||
<el-form-item class="button-group button-group-secondary">
|
||||
<el-button size="primary" @click="fillTF">腾峰</el-button>
|
||||
<el-button type="primary" size="medium" @click="fillFan">凡</el-button>
|
||||
<el-button type="primary" size="medium" @click="fillWen">纹</el-button>
|
||||
<el-button type="primary" size="medium" @click="fillHong">鸿</el-button>
|
||||
<el-button type="primary" size="medium" @click="fillPDD">拼多多</el-button>
|
||||
<el-button type="primary" size="medium" @click="fillPDDWen">拼多多-纹</el-button>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
@@ -505,26 +504,91 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.box-card { margin: 20px; }
|
||||
.box-card {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
/* 移动端卡片优化 */
|
||||
@media (max-width: 768px) {
|
||||
.box-card {
|
||||
margin: 10px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.box-card ::v-deep .el-card__header {
|
||||
padding: 12px 16px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.box-card ::v-deep .el-card__body {
|
||||
padding: 16px;
|
||||
}
|
||||
}
|
||||
.msg-block { margin-bottom: 12px; }
|
||||
.msg-header { display: flex; align-items: center; justify-content: space-between; margin: 6px 0; }
|
||||
|
||||
/* 按钮组样式 */
|
||||
.button-group {
|
||||
margin-bottom: 16px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.button-group .el-button {
|
||||
margin-right: 12px;
|
||||
margin-right: 0;
|
||||
padding: 12px 24px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
flex: 1;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
.button-group .el-button:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/* 移动端按钮优化 */
|
||||
@media (max-width: 768px) {
|
||||
.button-group {
|
||||
gap: 8px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.button-group .el-button {
|
||||
padding: 12px 8px;
|
||||
font-size: 13px;
|
||||
height: 44px; /* 增大触摸目标 */
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
/* 第一行按钮组(执行、清空、慢单、生)- 每行2个 */
|
||||
.button-group-primary {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.button-group-primary .el-button {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 第二行按钮组(腾峰、凡、纹等)- 每行3个 */
|
||||
.button-group-secondary {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.button-group-secondary .el-button {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 10px 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 历史记录控制条 */
|
||||
.history-controls {
|
||||
display: flex;
|
||||
@@ -551,6 +615,34 @@ export default {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
/* 移动端历史记录优化 */
|
||||
@media (max-width: 768px) {
|
||||
.history-container {
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.history-column {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history-content {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.history-controls {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 10px 12px;
|
||||
}
|
||||
|
||||
.history-label {
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.history-column {
|
||||
flex: 1;
|
||||
border: 1px solid #DCDFE6;
|
||||
|
||||
Reference in New Issue
Block a user