Commit eb02ed96 by Sweet Zhang

持牌人佣金对接

parent e96d7c40
...@@ -48,10 +48,11 @@ ...@@ -48,10 +48,11 @@
</view> </view>
</view> </view>
<!-- 各年费 --> <!-- 各年介绍费 -->
<view class="table-row" v-for="year in maxYears" :key="year"> <view class="table-row" v-for="year in maxYears" :key="year">
<view class="table-cell first-column"> <view class="table-cell first-column">
<text class="cell-text">保费(第{{ year }}年)</text> <text class="cell-text">介绍费</text>
<text class="cell-text">(第{{ year }}年)</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -82,8 +83,10 @@ ...@@ -82,8 +83,10 @@
<!-- 条件 --> <!-- 条件 -->
<view class="table-row"> <view class="table-row">
<view class="table-cell" v-for="(plan, index) in rateData" :key="index"> <view class="table-cell conditionContainer" v-for="(plan, index) in rateData" :key="index">
<text class="cell-text">供款年期 = {{ plan.term }} </text> <view><text class="cell-text">供款年期:</text><text class="cell-text">{{ plan.term }}</text></view>
<view v-if="plan.ageRange"><text class="cell-text">年龄:</text><text class="cell-text">{{ plan.ageRange }} </text></view>
<view v-if="plan.premiumRange"><text class="cell-text">保费:</text><text class="cell-text">{{ plan.premiumRange }} </text></view>
</view> </view>
</view> </view>
...@@ -111,7 +114,7 @@ ...@@ -111,7 +114,7 @@
</view> </view>
<!-- 无数据 --> <!-- 无数据 -->
<view class="error" v-if="rateData && rateData.length==0"> <view class="error" v-if="rateData && rateData.length==0 && !loading">
<text>暂无数据</text> <text>暂无数据</text>
</view> </view>
</view> </view>
...@@ -122,8 +125,8 @@ import { ref, onMounted,computed } from 'vue' ...@@ -122,8 +125,8 @@ import { ref, onMounted,computed } from 'vue'
import { useRouter, useRoute } from 'vue-router'; import { useRouter, useRoute } from 'vue-router';
import api from '@/api/api'; import api from '@/api/api';
// 计算最大年份数 // 默认最大年份是5
const maxYears = ref(7) const maxYears = ref(5)
// 获取指定年份的佣金率 // 获取指定年份的佣金率
const getCommissionRate = (plan, year) => { const getCommissionRate = (plan, year) => {
...@@ -161,11 +164,23 @@ const fetchRateData = async () => { ...@@ -161,11 +164,23 @@ const fetchRateData = async () => {
} }
const response = await api.queryRate(params) const response = await api.queryRate(params)
// 模拟API延迟
await new Promise(resolve => setTimeout(resolve, 800))
if (response.success) { if (response.success) {
rateData.value = response.data rateData.value = response.data
if(rateData.value && rateData.value.length>0){
rateData.value.forEach(item => {
if (item.termRateResponseList) {
item.termRateResponseList.forEach(term => {
if ((term.issueNumber > maxYears.value) &&
term.calculateRate > 0 ) {
maxYears.value = term.issueNumber;
}
});
}
});
}
console.log('maxYears:', maxYears);
} }
} catch (err) { } catch (err) {
...@@ -185,7 +200,7 @@ onMounted(() => { ...@@ -185,7 +200,7 @@ onMounted(() => {
<style scoped> <style scoped>
.container { .container {
padding: 20px; padding: 10rpx;
background-color: #f5f7fa; background-color: #f5f7fa;
min-height: 100vh; min-height: 100vh;
position: relative; position: relative;
...@@ -193,7 +208,7 @@ onMounted(() => { ...@@ -193,7 +208,7 @@ onMounted(() => {
.watermark-text { .watermark-text {
font-size: 24px; font-size: 48rpx;
color: #007AFF; color: #007AFF;
font-weight: bold; font-weight: bold;
white-space: nowrap; white-space: nowrap;
...@@ -215,8 +230,8 @@ onMounted(() => { ...@@ -215,8 +230,8 @@ onMounted(() => {
position: absolute; position: absolute;
opacity: 0.06; opacity: 0.06;
transform: rotate(-30deg); transform: rotate(-30deg);
font-size: 16px; font-size: 32rpx;
color: #666; color: #333;
font-weight: 500; font-weight: 500;
white-space: nowrap; white-space: nowrap;
} }
...@@ -254,8 +269,8 @@ onMounted(() => { ...@@ -254,8 +269,8 @@ onMounted(() => {
.loading, .error { .loading, .error {
text-align: center; text-align: center;
padding: 20px; padding: 40rpx;
color: #666; color: #333;
position: relative; position: relative;
z-index: 10; z-index: 10;
} }
...@@ -268,19 +283,19 @@ onMounted(() => { ...@@ -268,19 +283,19 @@ onMounted(() => {
border: 1px solid #dcdfe6; border: 1px solid #dcdfe6;
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
margin-top: 10px; margin-top: 20rpx;
} }
.contract-title { .contract-title {
background: #f5f7fa; background: #f5f7fa;
padding: 12px 15px; padding: 24rpx 30rpx;
border-bottom: 1px solid #dcdfe6; border-bottom: 1px solid #dcdfe6;
} }
.contract-name { .contract-name {
font-size: 14px; font-size: 28rpx;
font-weight: 600; font-weight: 600;
color: #303133; color: #333;
} }
/* 表格容器 */ /* 表格容器 */
...@@ -292,12 +307,24 @@ onMounted(() => { ...@@ -292,12 +307,24 @@ onMounted(() => {
/* 固定左侧列 */ /* 固定左侧列 */
.fixed-column { .fixed-column {
width: 100px; width: 160rpx;
flex-shrink: 0; flex-shrink: 0;
z-index: 10; z-index: 10;
box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1); box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
white-space: nowrap;
} }
/* 固定列样式 */
.fixed-column .table-cell {
width: 160rpx;
background: #fafafa;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
/* 可滚动右侧内容 */ /* 可滚动右侧内容 */
.scroll-content { .scroll-content {
flex: 1; flex: 1;
...@@ -311,7 +338,7 @@ onMounted(() => { ...@@ -311,7 +338,7 @@ onMounted(() => {
/* 表格行通用样式 */ /* 表格行通用样式 */
.table-row { .table-row {
display: flex; display: flex;
min-height: 44px; min-height: 88rpx;
border-bottom: 1px solid #ebeef5; border-bottom: 1px solid #ebeef5;
} }
...@@ -326,41 +353,35 @@ onMounted(() => { ...@@ -326,41 +353,35 @@ onMounted(() => {
/* 表格单元格通用样式 */ /* 表格单元格通用样式 */
.table-cell { .table-cell {
min-height: 44px; min-height: 88rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
border-right: 1px solid #ebeef5; border-right: 1px solid #ebeef5;
padding: 12px 8px; padding: 24rpx 16rpx;
} }
.table-cell:last-child { .table-cell:last-child {
border-right: none; border-right: none;
} }
/* 固定列样式 */
.fixed-column .table-cell {
width: 100px;
justify-content: flex-start;
padding-left: 15px;
background: #fafafa;
}
/* 滚动列样式 */ /* 滚动列样式 */
.scroll-inner .table-cell { .scroll-inner .table-cell {
min-width: 120px; min-width: 240rpx;
flex: 1; flex: 1;
} }
.cell-text { .cell-text {
font-size: 13px; font-size: 26rpx;
color: #606266; color: #333;
line-height: 1.4; line-height: 1.4;
} }
.header-row .cell-text { .header-row .cell-text {
color: #303133; color: #333;
font-weight: 600; font-weight: 600;
} }
...@@ -372,18 +393,27 @@ onMounted(() => { ...@@ -372,18 +393,27 @@ onMounted(() => {
/* 其他样式保持不变 */ /* 其他样式保持不变 */
.info-card { .info-card {
background-color: white; background-color: white;
border-radius: 8px; border-radius: 16rpx;
padding: 15px; padding: 20rpx;
margin-bottom: 15px; margin-bottom: 30rpx;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); box-shadow: 0 4rpx 48rpx rgba(0, 0, 0, 0.05);
position: relative; position: relative;
z-index: 10; z-index: 10;
} }
.info-title { .info-title {
font-size: 16px; font-size: 32rpx;
font-weight: bold; font-weight: bold;
margin-bottom: 10px; margin-bottom: 20rpx;
color: #333; color: #333;
} }
.conditionContainer{
display: flex;
flex-direction: column;
}
.conditionContainer view{
width: 100%;
margin: 0 auto;
}
</style> </style>
\ No newline at end of file
...@@ -17,10 +17,10 @@ ...@@ -17,10 +17,10 @@
</view> </view>
<!-- 产品列表 --> <!-- 产品列表 -->
<view class="product-list" v-if="!loading && filteredProducts.length > 0"> <view class="product-list" v-if="!loading && products.length > 0">
<view <view
class="product-item" class="product-item"
v-for="product in filteredProducts" v-for="product in products"
:key="product.planBizId" :key="product.planBizId"
@click="goToCommissionDetail(product)" @click="goToCommissionDetail(product)"
> >
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</view> </view>
<!-- 空状态 --> <!-- 空状态 -->
<view class="empty" v-if="!loading && filteredProducts.length === 0"> <view class="empty" v-if="!loading && products.length === 0">
<text>暂无产品数据</text> <text>暂无产品数据</text>
</view> </view>
</view> </view>
...@@ -62,16 +62,6 @@ const searchKeyword = ref('') ...@@ -62,16 +62,6 @@ const searchKeyword = ref('')
const products = ref([]) const products = ref([])
const loading = ref(false) const loading = ref(false)
// 计算属性 - 筛选后的产品列表
const filteredProducts = computed(() => {
if (!searchKeyword.value) {
return products.value
}
return products.value.filter(product =>
product.planName.toLowerCase().includes(searchKeyword.value.toLowerCase()) ||
product.companyName.toLowerCase().includes(searchKeyword.value.toLowerCase())
)
})
// 方法 // 方法
const handleSearch = () => { const handleSearch = () => {
...@@ -88,7 +78,6 @@ const goToCommissionDetail = (product) => { ...@@ -88,7 +78,6 @@ const goToCommissionDetail = (product) => {
// 获取产品数据 // 获取产品数据
const fetchProducts = async (type=0) => { const fetchProducts = async (type=0) => {
loading.value = true loading.value = true
try { try {
let params = { let params = {
name:searchKeyword.value name:searchKeyword.value
...@@ -130,7 +119,7 @@ onMounted(() => { ...@@ -130,7 +119,7 @@ onMounted(() => {
<style scoped> <style scoped>
.container { .container {
padding: 20px; padding: 20rpx;
background-color: #f5f7fa; background-color: #f5f7fa;
min-height: 100vh; min-height: 100vh;
} }
...@@ -156,10 +145,8 @@ onMounted(() => { ...@@ -156,10 +145,8 @@ onMounted(() => {
.search-input { .search-input {
width: 100%; width: 100%;
padding: 12px 40px 12px 15px; padding: 24rpx 80rpx 24rpx 30rpx;
border: 1px solid #e0e0e0; font-size: 28rpx;
border-radius: 8px;
font-size: 14px;
} }
.search-icon { .search-icon {
...@@ -198,44 +185,44 @@ onMounted(() => { ...@@ -198,44 +185,44 @@ onMounted(() => {
} }
.product-term { .product-term {
font-size: 14px; font-size: 28rpx;
color: #007AFF; color: #007AFF;
background-color: #f0f7ff; background-color: #f0f7ff;
padding: 2px 8px; padding: 4rpx 16rpx;
border-radius: 4px; border-radius: 8rpx;
} }
.product-info { .product-info {
margin-bottom: 5px; margin-bottom: 10rpx;
} }
.info-item { .info-item {
margin-bottom: 5px; margin-bottom: 10rpx;
} }
.info-label { .info-label {
color: #666; color: #666;
font-size: 12px; font-size: 28rpx;
} }
.info-value { .info-value {
color: #333; color: #333;
font-size: 12px; font-size: 28rpx;
font-weight: 500; font-weight: 500;
} }
.arrow { .arrow {
position: absolute; position: absolute;
right: 15px; right: 30rpx;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
color: #999; color: #999;
font-size: 18px; font-size: 36rpx;
} }
.loading, .empty { .loading, .empty {
text-align: center; text-align: center;
padding: 40px 20px; padding: 80rpx 40rpx;
color: #666; color: #666;
} }
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment