From f6cc5b4accb06a0e3974cd83f88bde159c40bc80 Mon Sep 17 00:00:00 2001
From: zq <136432190602163.com>
Date: Fri, 30 May 2025 14:50:10 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=B0=94=E6=B3=A1=E5=BC=B9?=
=?UTF-8?q?=E5=87=BA=E6=A1=86=E5=AE=9A=E4=BD=8D=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/style/theme/common.scss | 8 ++++
src/views/super/Ranking/RankBatchList.vue | 62 ++++++++++++++++++++-----------
2 files changed, 48 insertions(+), 22 deletions(-)
diff --git a/src/style/theme/common.scss b/src/style/theme/common.scss
index d9312ec..01abe15 100644
--- a/src/style/theme/common.scss
+++ b/src/style/theme/common.scss
@@ -951,6 +951,14 @@ body {
.el-popover {
padding: 32px;
}
+::v-deep .custom-popover {
+ position: fixed !important;
+ max-height: 290px;
+ overflow-y: auto;
+ margin-top: 0 !important;
+ margin-left: 0 !important;
+ transform: none !important;
+}
// 日历区间背景颜色
.el-date-table td.in-range div {
diff --git a/src/views/super/Ranking/RankBatchList.vue b/src/views/super/Ranking/RankBatchList.vue
index dd6b547..2da66f0 100644
--- a/src/views/super/Ranking/RankBatchList.vue
+++ b/src/views/super/Ranking/RankBatchList.vue
@@ -26,7 +26,7 @@
<GuipTable :tableData="tableData" style="width: 100%" :border="true" @sort-change="handleSortChange"
:loading="loading" @cell-mouse-enter="handleRowHover">
<el-table-column fixed="left" prop="sort" label="排序" width="70"></el-table-column>
- <el-table-column
+ <el-table-column
v-if="(dataRank == 1 || dataRank == 2) && (dataType == 'ver_type' || dataType == 'check_type')"
prop="name" :key="selectedType" :label="type_select[selectedType]" min-width="120">
@@ -47,20 +47,23 @@
<el-table-column v-else prop="name" :label="type_desc[dataType]" width="150"></el-table-column>
<el-table-column v-for="(field, index) in valueFields" :key="field" :label="labels[index]"
- :prop="String(index + 1)"
+ :prop="String(index + 1)"
:render-header=" (h, scope) => index == 3 ? renderHeaderWithIcon(h, scope, require('@/assets/require.svg')) : scope.column.label"
sortable="custom" min-width="170">
<!--产品利润排行展示查看更多-->
<template v-if="index == 3 && dataRank == 1" v-slot="{ row, $index }">
- <el-popover v-model="row.id_popover" placement="top" trigger="manual"
+ <!-- <el-popover v-model="row.id_popover" placement="top" trigger="manual"
:ref="`popover-${$index}`" :append-to-body="false" :visible-arrow="true"
- popper-class="custom-popover" @show="popshow">
+ popper-class="custom-popover" @show="popshow"> -->
+ <el-popover v-model="row.id_popover" :ref="`popover-${row.id}`"
+ placement="top" trigger="manual" :append-to-body="false" :visible-arrow="true"
+ popper-class="custom-popover" @show="popshow" >
<div v-if="type != 'agent'" class="pop-wrap">
<div class="flex-between flex pop-top">
<h3>
- {{ text }} {{ row.name }}
+ {{ row.name }}
<span class="lookMore" @click="goLookMoreData(row.id)">查看更多</span>
</h3>
<span class="flex point" @click="closePop(row,'id')">
@@ -82,7 +85,7 @@
<div v-else class="pop-wrap">
<div class="flex-between flex pop-top">
<h3>
- {{ text }} {{ row.name }}
+ {{ row.name }}
<span class="lookMore" @click="goLookCheckTypeRank(row.id)">查看更多</span>
</h3>
<span class="flex point" @click="closePop(row,'id')">
@@ -91,7 +94,7 @@
</div>
<el-table :data="tableData1" style="width: 100%">
<el-table-column prop="sort" width="95" label="排序">
-
+
</el-table-column>
<el-table-column prop="name" width="250" label="服务名称"></el-table-column>
<el-table-column prop="rate" width="130" label="毛利占比">
@@ -114,15 +117,15 @@
<div class="flex" slot="reference">
{{ row[field] }}
- <svg-icon v-if="row[field] > 0" :size="14"
- :path="require('@/assets/super/list-detail.svg')" :color="'#8A9099'"
- :hoverColor="'#006AFF'" @click="handleClick(row, $index, 'id')" />
+ <svg-icon :size="14" v-if="row[field] *100 != 0"
+ :path="require('@/assets/super/list-detail.svg')" :color="'#8A9099'"
+ :hoverColor="'#006AFF'" @click="handleClick(row, $index, 'id')" />
</div>
</el-popover>
</template>
- <template v-else slot-scope="scope" >
- <div class="flex" >
+ <template v-else slot-scope="scope">
+ <div class="flex">
{{ scope.row[field] }}
</div>
</template>
@@ -133,9 +136,10 @@
:render-header=" (h, scope) => renderHeaderWithIcon(h, scope, require('@/assets/require.svg')) "
key="top" prop="top" label="代理商排行" width="250" fixed="right">
<template v-slot="{ row, $index }">
- <el-popover v-model="row.id_popover_2" placement="top" trigger="manual"
- popper-class="custom-popover"
- :ref="`popover_2-${$index}`" @show="popshow" :append-to-body="false" :visible-arrow="true">
+ <el-popover v-model="row.id_popover_2" :ref="`popover_2-${$index}`" placement="top" trigger="manual"
+ popper-class="custom-popover" @show="popshow" :append-to-body="false"
+ :visible-arrow="true"
+ >
<div class="pop-wrap">
<div class="flex-between flex pop-top">
<h3>
@@ -152,7 +156,7 @@
<el-table-column prop="value_1" width="200" label="销售额"></el-table-column>
</el-table>
</div>
- <span v-if="top_list[row.id]" slot="reference">
+ <span v-if="top_list[row.id]" slot="reference" class="flex">
No.1 {{ top_list[row.id]['name'] }}
<svg-icon :size="14" @click="handleClick2(row, $index, 'id')"
:path="require('@/assets/super/list-detail.svg')" :color="'#8A9099'"
@@ -177,6 +181,7 @@ import GuipTable from '@/components/GuipTable.vue';
import CustomDropdown from '@/components/CustomDropdown.vue';
import SvgIcon from '@/components/SvgIcon.vue';
import GuipToolTip from '@/components/GuipToolTip.vue';
+// import HoverImage from '@/components/super/HoverImage.vue';
export default {
name: 'rank_batch_list',
props: {
@@ -372,6 +377,7 @@ export default {
}
},
handleClick2(row, index, type) {
+ console.log('执行了');
// 关闭其他行的弹框
this.tableData.forEach((item, i) => {
item[type + '_popover'] = false;
@@ -406,7 +412,7 @@ export default {
})
},
handleSortChange({ prop, order }) {
- console.log('prop--排序',prop);
+ console.log('prop--排序', prop);
this.sort_by = 4;
this.sort_order = 2;
if (order == 'ascending') {
@@ -598,16 +604,26 @@ export default {
}
</script>
<style scoped lang="scss">
-.pagetitle{
- h4{
+.pagetitle {
+ h4 {
margin-bottom: 0;
}
}
+::v-deep .custom-popover {
+ position: fixed !important;
+ max-height: 290px;
+ overflow-y: auto;
+ margin-top: 0 !important;
+ margin-left: 0 !important;
+ transform: none !important;
+}
+
.lookMore {
cursor: pointer;
font-weight: 400;
}
-.beforeNotice{
+
+.beforeNotice {
margin-top: 12px;
border-radius: 4px;
background: #F2F7FF;
@@ -615,12 +631,14 @@ export default {
padding: 20px 14px;
color: #1E2226;
letter-spacing: 0.08em;
- .noticeTop{
+
+ .noticeTop {
gap: 8px;
margin-bottom: 12px;
}
- .noticeBot{
+
+ .noticeBot {
gap: 10px;
}