admin/jurong_circle_frontdesk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

合并代码

Browse Source
This commit is contained in:
szz
2025-08-07 09:35:48 +08:00
parent 0ec9fab7ff
commit 18aac345f1
5 changed files with 277 additions and 606 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
src/views/Matching.vue
View File

@@ -5,38 +5,23 @@
<!-- <p class="subtitle">智能匹配，循环增值</p> -->
</div>
<!-- 统计卡片 -->
<!-- <div class="stats-cards">
<div class="stat-card">
<div class="stat-number">{{ stats.userStats?.initiated_orders || 0 }}</div>
<div class="stat-label">发起订单</div>
</div>
<div class="stat-card">
<div class="stat-number">{{ stats.userStats?.participated_allocations || 0 }}</div>
<div class="stat-label">参与分配</div>
</div>
</div> -->
<!-- 操作区域 -->
<div class="action-section">
<div class="create-order-card">
<h3>货款匹配</h3>
<!-- 匹配类型选择 -->
<div class="matching-type-selector">
<div class="type-tabs">
<button
:class="['type-tab', { active: matchingType === 'small' }]"
@click="matchingType = 'small'"
>
小额匹配
</button>
<button
:class="['type-tab', { active: matchingType === 'large' }]"
@click="matchingType = 'large'"
>
大额匹配
</button>
<div class="card-header">
<h3>货款匹配</h3>
<div class="toggle-container">
<span class="toggle-label">开启大额匹配</span>
<label class="apple-switch">
<input
type="checkbox"
v-model="tempMatchingType"
true-value="large"
false-value="small"
@change="handleMatchingTypeChange"
>
<span class="apple-switch-slider"></span>
</label>
</div>
</div>
@@ -102,7 +87,7 @@
<div v-if="matchingType === 'large'" class="tips">
<p>• 金额范围：5000-50000元</p>
<p>• 15000元以下：分成3笔随机金额</p>
<p>• 15000元以上：随机分拆，每笔1000-8000元</p>
<p>• 15000元以上：随机分拆，每笔100-10000元</p>
<p>• 优先匹配已完成进货的用户</p>
</div>
</div>
@@ -339,6 +324,27 @@
</span>
</template>
</el-dialog>
<!-- 大额匹配确认弹窗 -->
<el-dialog
v-model="showLargeMatchingConfirm"
title="开启大额匹配"
width="90%"
:style="{ maxWidth: '500px' }"
>
<div class="confirm-dialog-content">
<p>确认要开启大额匹配吗？</p>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancelLargeMatching">取消</el-button>
<el-button type="primary" @click="confirmLargeMatching">
确认开启
</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
@@ -377,13 +383,36 @@ export default {
actualAmount: 0,
voucher: '',
description: ''
}
},
showLargeMatchingConfirm: false,
tempMatchingType: 'small' // 临时存储切换前的类型
}
},
async mounted() {
await this.loadData()
},
methods: {
handleMatchingTypeChange() {
if (this.tempMatchingType === 'large') {
// 如果要切换到大额匹配，显示确认对话框
this.showLargeMatchingConfirm = true
} else {
// 直接切换到小额匹配
this.matchingType = this.tempMatchingType
}
},
confirmLargeMatching() {
this.matchingType = 'large'
this.showLargeMatchingConfirm = false
this.$message.success('已开启大额匹配模式')
},
cancelLargeMatching() {
this.tempMatchingType = 'small' // 重置开关状态
this.showLargeMatchingConfirm = false
},
async loadData() {
try {
await Promise.all([
@@ -635,7 +664,7 @@ export default {
} else if (amount <= 15000) {
return '分成3笔随机金额'
} else {
return '随机分拆，每笔1000-8000元'
return '随机分拆，每笔100-10000元'
}
},
@@ -651,8 +680,8 @@ export default {
return '3'
} else {
// 15000以上随机分拆，估算笔数范围
const minCount = Math.ceil(amount / 8000) // 按最大单笔8000计算最少笔数
const maxCount = Math.floor(amount / 1000) // 按最小单笔1000计算最多笔数
const minCount = Math.ceil(amount / 10000) // 按最大单笔10000计算最少笔数
const maxCount = Math.floor(amount / 100) // 按最小单笔100计算最多笔数
return `${minCount}-${Math.min(maxCount, 10)}` // 限制最大显示笔数为10
}
},
@@ -790,6 +819,7 @@ export default {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
background: linear-gradient(to bottom, #72c9ffae, #f3f3f3);
}
.header {
@@ -841,6 +871,76 @@ export default {
margin-bottom: 30px;
}
.card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
}
.toggle-container {
display: flex;
align-items: center;
gap: 8px;
}
.toggle-label {
font-size: 12px;
color: #666;
}
.apple-switch {
position: relative;
display: inline-block;
width: 34px;
height: 16px;
}
.apple-switch input {
opacity: 0;
width: 0;
height: 0;
}
.apple-switch-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #e0e0e0;
transition: .4s;
border-radius: 16px;
}
.apple-switch-slider:before {
position: absolute;
content: "";
height: 12px;
width: 12px;
left: 2px;
bottom: 2px;
background-color: white;
transition: .4s;
border-radius: 50%;
}
.apple-switch input:checked + .apple-switch-slider {
background-color: #4CD964;
}
.apple-switch input:checked + .apple-switch-slider:before {
transform: translateX(18px);
}
/* 移除原有的匹配类型选择器样式 */
.matching-type-selector,
.type-tabs,
.type-tab {
display: none;
}
.create-order-card {
background: white;
padding: 20px;
@@ -903,15 +1003,18 @@ export default {
}
.create-btn {
width: 100%;
width: 50%;
padding: 12px;
background: #3498db;
background: #0099ff;
color: white;
border: none;
border-radius: 5px;
border-radius: 1000px; /* 保持胶囊形状 */
font-size: 16px;
cursor: pointer;
transition: background 0.3s;
display: block; /* 改为块级元素 */
margin: 0 auto; /* 水平居中 */
text-align: center; /* 文字居中 */
}
.create-btn:hover {