删除了多余的/mymatching,调整了部分主页样式
This commit is contained in:
BIN
public/imgs/mainpage/dinglianghuoqu1.png
Normal file
BIN
public/imgs/mainpage/dinglianghuoqu1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 194 KiB |
BIN
public/imgs/mainpage/dinglianghuoqu2.png
Normal file
BIN
public/imgs/mainpage/dinglianghuoqu2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 196 KiB |
BIN
public/imgs/mainpage/huoqurongdou1.png
Normal file
BIN
public/imgs/mainpage/huoqurongdou1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 188 KiB |
BIN
public/imgs/mainpage/huoqurongdou2.png
Normal file
BIN
public/imgs/mainpage/huoqurongdou2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
BIN
public/imgs/mainpage/shangcheng1.png
Normal file
BIN
public/imgs/mainpage/shangcheng1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 187 KiB |
BIN
public/imgs/mainpage/shangcheng2.png
Normal file
BIN
public/imgs/mainpage/shangcheng2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 188 KiB |
@@ -25,7 +25,6 @@ const routesWithBottomNav = [
|
||||
'/orders',
|
||||
'/mainpage',
|
||||
'/myprofile',
|
||||
'/mymatching',
|
||||
'/myshop',
|
||||
'/customerservice'
|
||||
]
|
||||
|
||||
@@ -3,16 +3,16 @@
|
||||
<!-- 融豆匹配 -->
|
||||
<div
|
||||
class="nav-item"
|
||||
:class="{ active: isActive('/mymatching') }"
|
||||
@click="handleNavClick('/mymatching')"
|
||||
:class="{ active: isActive('/matching') }"
|
||||
@click="handleNavClick('/matching')"
|
||||
>
|
||||
<img
|
||||
src="/imgs/bottomnav/rongdoupipei.png"
|
||||
alt="融豆匹配"
|
||||
class="nav-image"
|
||||
:class="{ 'nav-image-active': isActive('/mymatching') }"
|
||||
:class="{ 'nav-image-active': isActive('/matching') }"
|
||||
/>
|
||||
<span class="nav-text" :class="{ 'nav-text-active': isActive('/mymatching') }">融豆匹配</span>
|
||||
<span class="nav-text" :class="{ 'nav-text-active': isActive('/matching') }">融豆匹配</span>
|
||||
</div>
|
||||
<!-- 融豆明细 -->
|
||||
<div
|
||||
@@ -98,7 +98,7 @@ const handleNavClick = (path) => {
|
||||
const backgroundImage = computed(() => {
|
||||
const currentPath = route.path
|
||||
switch (currentPath) {
|
||||
case '/mymatching':
|
||||
case '/matching':
|
||||
// return '/imgs/bottomnav/融豆匹配背景.png'
|
||||
return '/imgs/bottomnav/rongdoupipei-background.png'
|
||||
case '/transfers':
|
||||
|
||||
@@ -29,15 +29,6 @@ const routes = [
|
||||
title: '主页'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/mymatching',
|
||||
name: 'MyMatching',
|
||||
component: () => import('@/views/Matching.vue'),
|
||||
meta: {
|
||||
title: '货款匹配',
|
||||
requiresAuth: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/myshop',
|
||||
name: 'MyShop',
|
||||
|
||||
@@ -37,25 +37,18 @@
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<!-- 修改后的操作区域 - 三个部分等宽 -->
|
||||
<!-- 修改后的操作区域 - 三个图片并排 -->
|
||||
<div class="action-area">
|
||||
<div class="action-grid">
|
||||
<router-link to="/mymatching?autoStart=true" class="action-main">
|
||||
<div class="matching-text">
|
||||
<div>获取</div>
|
||||
<div>融豆</div>
|
||||
</div>
|
||||
<div class="action-grid-horizontal">
|
||||
<router-link to="/matching?quantitative=true" class="action-item">
|
||||
<img src="/imgs/mainpage/dinglianghuoqu1.png" alt="定量获取" class="action-image" />
|
||||
</router-link>
|
||||
<div class="action-stack">
|
||||
<div class="action-sub-item top">
|
||||
<div class="action-icon">💎</div>
|
||||
<div class="action-text">当前积分: {{ userPoints }}</div>
|
||||
</div>
|
||||
<router-link to="/myshop" class="action-sub-item bottom">
|
||||
<div class="action-icon">🛒</div>
|
||||
<div class="action-text">商城</div>
|
||||
<router-link to="/matching" class="action-item">
|
||||
<img src="/imgs/mainpage/huoqurongdou1.png" alt="获取融豆" class="action-image" />
|
||||
</router-link>
|
||||
<router-link to="/myshop" class="action-item">
|
||||
<img src="/imgs/mainpage/shangcheng1.png" alt="商城" class="action-image" />
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -331,82 +324,34 @@ export default {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.action-grid {
|
||||
.action-grid-horizontal {
|
||||
display: flex;
|
||||
gap: 20px; /* 修改为20px间距 */
|
||||
height: 204px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.action-main {
|
||||
width: 159px;
|
||||
height: 204px;
|
||||
.action-item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
border-radius: 12px;
|
||||
box-shadow: var(--box-shadow);
|
||||
align-items: center;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: var(--transition);
|
||||
text-decoration: none;
|
||||
padding: 63px 47px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.action-main:hover {
|
||||
transform: scale(1.02);
|
||||
box-shadow: 0 8px 15px rgba(67, 97, 238, 0.3);
|
||||
.action-item:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.action-stack {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px; /* 修改为20px间距 */
|
||||
width: 165px;
|
||||
}
|
||||
|
||||
.action-sub-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: white;
|
||||
border-radius: 12px;
|
||||
box-shadow: var(--box-shadow);
|
||||
cursor: pointer;
|
||||
transition: var(--transition);
|
||||
text-decoration: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.action-sub-item.top {
|
||||
width: 165px;
|
||||
height: 92px;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.action-sub-item.bottom {
|
||||
width: 165px;
|
||||
height: 92px;
|
||||
color: var(--success-color);
|
||||
}
|
||||
|
||||
.action-sub-item:hover {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.action-icon {
|
||||
font-size: 20px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.action-text {
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
.action-image {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
max-width: 110px;
|
||||
object-fit: contain;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
/* 热门资讯 */
|
||||
|
||||
@@ -458,6 +458,19 @@ export default {
|
||||
tempMatchingType: 'small' // 临时存储切换前的类型
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
// 处理定量获取参数
|
||||
if (this.$route.query.quantitative === 'true') {
|
||||
this.matchingType = 'large';
|
||||
this.tempMatchingType = 'large'; // 同步临时状态
|
||||
}
|
||||
|
||||
// 在处理完所有参数后清除query参数
|
||||
if (this.$route.query.quantitative) {
|
||||
this.$router.replace({ ...this.$route, query: {} });
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
await this.loadData()
|
||||
},
|
||||
@@ -927,6 +940,12 @@ export default {
|
||||
uploadHeaders() {
|
||||
return getUploadConfig().headers
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
matchingType(newVal, oldVal) {
|
||||
console.log('更改匹配模式', oldVal, 'to', newVal);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -23,7 +23,7 @@
|
||||
:key="'allocation-' + allocation.id"
|
||||
class="transfer-item pending"
|
||||
:class="{ 'timeout-item': !allocation.can_transfer }"
|
||||
@click="router.push(`/mymatching`)"
|
||||
@click="router.push(`/matching`)"
|
||||
>
|
||||
<div class="transfer-info">
|
||||
<div class="transfer-header">
|
||||
|
||||
Reference in New Issue
Block a user