zhangqi
/
kuailelunwen_new_houtai
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

组件更新

pull/2/head
pengda 3 months ago
parent
bea80334ee
commit
0635e58a12
4 changed files with 530 additions and 396 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/assets/super/select-active.svg
  2. 307
      src/views/super/Ranking/RankBatchList.vue
  3. 245
      src/views/super/Ranking/RankDetail.vue
  4. 9
      src/views/super/Ranking/Ranking.vue

1
src/assets/super/select-active.svg
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="16" height="16" viewBox="0 0 16 16"><g><g></g><g><path d="M13.5732,5.315390953125Q13.6985,5.197082953125,13.7668,5.0388329531250005Q13.835,4.880582953125,13.835,4.708251953125Q13.835,4.626011653125,13.819,4.545351953125Q13.8029,4.464691953125,13.7714,4.388710953125Q13.74,4.3127309531249995,13.6943,4.244350953125Q13.6486,4.175970953125,13.5904,4.117817953125Q13.5323,4.059664953125,13.4639,4.013974953125Q13.3955,3.968284953125,13.3195,3.936812953125Q13.2436,3.905340953125,13.1629,3.889295953125Q13.0822,3.873251953125,13,3.873251953125Q12.90746,3.873251953125,12.81716,3.8935169531250002Q12.72686,3.913781953125,12.64319,3.953328953125Q12.55951,3.992875953125,12.48654,4.049783953125Q12.41356,4.106692953125,12.35481,4.178200953125L7.06803,9.842611953125001L3.542182,7.198221953125Q3.428807,7.101421953125,3.288942,7.049841953125Q3.149076,6.998251953125,3,6.998251953125Q2.9177597,6.998251953125,2.8371,7.014291953124999Q2.75644,7.030341953125,2.680459,7.061811953125Q2.604479,7.093281953125,2.536099,7.138971953125Q2.4677189999999998,7.184661953125,2.409566,7.242821953125Q2.351413,7.300971953125,2.305723,7.369351953124999Q2.260033,7.437731953125001,2.228561,7.513711953125Q2.197089,7.589691953125,2.181044,7.6703519531249995Q2.165,7.7510119531249995,2.165,7.833251953125Q2.165,7.937161953125,2.190469,8.037911953125Q2.215938,8.138651953125,2.265322,8.230081953125Q2.314706,8.321511953125,2.384993,8.398041953125Q2.45528,8.474581953125,2.542182,8.531551953125L6.66667,11.624921953125Q6.72781,11.670781953125001,6.796279999999999,11.704751953125001Q6.864739999999999,11.738721953125001,6.93825,11.759671953125Q7.01175,11.780621953125,7.08784,11.787851953125Q7.16393,11.795081953124999,7.24006,11.788351953125Q7.31619,11.781621953125,7.38983,11.761151953125001Q7.46347,11.740681953125,7.53216,11.707161953125Q7.60084,11.673641953125,7.66229,11.628181953125Q7.72373,11.582721953124999,7.77588,11.526851953125L13.5732,5.315390953125Z" fill-rule="evenodd" fill="#006AFF" fill-opacity="1"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

307
src/views/super/Ranking/RankBatchList.vue
View File

@ -1,59 +1,102 @@
<template> <template>
<div class="demo-wrap min-flex-right"> <div class="demo-wrap min-flex-right">
<div class="flex-between"> <div class="flex-between">
<h2>{{pageTitle}}</h2> <h2>{{ pageTitle }}</h2>
<CustomDropdown ref="dropdownRef" :placeholder="'（'+viewDesc[this.view]+')'+text" width="280px"> <CustomDropdown ref="dropdownRef"
<DateSelect slot="normal" :view="view" v-model="selectedDate" @update-count="handleUpdateView" @change="handleDateChange" /> :placeholder="'（'+viewDesc[this.view]+')'+text"
width="280px">
<DateSelect slot="normal"
:view="view"
v-model="selectedDate"
@update-count="handleUpdateView"
@change="handleDateChange"/>
</CustomDropdown> </CustomDropdown>
</div> </div>
<div class=" flex-common" id=""> <div class=" flex-common" id="">
<el-form> <el-form>
<el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" @cell-mouse-enter="handleRowHover"> <el-table :data="tableData"
style="width: 100%"
@sort-change="handleSortChange"
@cell-mouse-enter="handleRowHover">
<el-table-column prop="sort" label="排序" width="100"></el-table-column> <el-table-column prop="sort" label="排序" width="100"></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]"> <el-table-column
v-if="(dataRank == 1 || dataRank == 2) && (dataType == 'ver_type' || dataType == 'check_type')"
prop="name"
:key="selectedType"
:label="type_select[selectedType]">
<template slot="header"> <template slot="header">
<el-select class="custom-select" v-model="selectedType" @change="changeRankType"> <el-select class="custom-select" v-model="selectedType" @change="changeRankType">
<el-option v-for="(item,type) in type_select" :key="type" :label="item" :value="type"></el-option> <el-option v-for="(item,type) in type_select"
:key="type"
:label="item"
:value="type">
</el-option>
</el-select> </el-select>
</template> </template>
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.name }} {{ scope.row.name }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column v-else prop="name" :label="type_desc[dataType]" width="150"></el-table-column> <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)" sortable="custom"> <el-table-column v-for="(field, index) in valueFields"
:key="field"
:label="labels[index]"
:prop="String(index + 1)"
sortable="custom">
<template v-if="index == 3 && dataRank == 1 && type != 'agent'" v-slot="{ row, $index }"> <template v-if="index == 3 && dataRank == 1 && type != 'agent'" v-slot="{ row, $index }">
<el-popover v-model="row.id_popover" placement="top" trigger="manual" :ref="`popover-${$index}`" @show="popshow"> <el-popover v-model="row.id_popover"
placement="top"
trigger="manual"
:ref="`popover-${$index}`"
@show="popshow">
<div class="pop-wrap"> <div class="pop-wrap">
<div class="flex-between flex pop-top"> <div class="flex-between flex pop-top">
<h3>{{ text }} {{ row.name }} <span @click="goLookMoreData(row.id)">查看更多</span></h3> <h3>
<span class="flex point" @click="closePop(row,'id')">关闭 <img src="@/assets/register/close.svg" alt=""></span> {{ text }} {{ row.name }}
<span @click="goLookMoreData(row.id)">查看更多</span>
</h3>
<span class="flex point" @click="closePop(row,'id')">
关闭<img src="@/assets/register/close.svg">
</span>
</div> </div>
<el-table :data="tableData1" style="width: 100%"> <el-table :data="tableData1" style="width: 100%">
<el-table-column prop="value_1" width="208" label="日期"></el-table-column> <el-table-column prop="value_1" width="208" label="日期"></el-table-column>
<el-table-column width="348" :label="rank_type_desc[dataRank]"> <el-table-column width="348" :label="rank_type_desc[dataRank]">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex"> <div class="flex">
{{ scope.row.value_2 }} {{ scope.row.value_2 }}
<template v-if="Object.keys(growth_list1).length > 0"> <template v-if="Object.keys(growth_list1).length > 0">
<span class="flex growth-text" v-if="growth_list1[scope.row.id]"> <span v-if="growth_list1[scope.row.id]"
class="flex growth-text">
<span v-if="growth_list1[scope.row.id].value>0"> <span v-if="growth_list1[scope.row.id].value>0">
<span class="growth-up"> <span class="growth-up">
<img class="edit_icon" src="@/assets/super/growth-up.svg" alt="">{{growth_list1[scope.row.id].value}}% <img class="edit_icon"
src="@/assets/super/growth-up.svg">
{{ growth_list1[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list1[scope.row.id].value<0"> <span v-if="growth_list1[scope.row.id].value<0">
<span class="growth-down"> <span class="growth-down">
<img class="edit_icon" src="@/assets/super/growth-down.svg" alt="">{{growth_list1[scope.row.id].value}}% <img class="edit_icon"
src="@/assets/super/growth-down.svg">
{{ growth_list1[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list1[scope.row.id].value==0"> <span v-if="growth_list1[scope.row.id].value==0">
<img class="edit_icon" src="@/assets/super/growth-flat.svg" alt="">同比上年持平 <img class="edit_icon"
src="@/assets/super/growth-flat.svg">同比上年持平
</span> </span>
</span> </span>
<span class="flex growth-text" v-else>上年无数据</span> <span v-else class="flex growth-text">上年无数据</span>
</template> </template>
</div> </div>
</template> </template>
@ -61,29 +104,31 @@
</el-table> </el-table>
</div> </div>
<div class="flex" slot="reference" > <div class="flex" slot="reference">
{{ row[field] }} {{ row[field] }}
<template v-if="Object.keys(growth_list).length > 0"> <template v-if="Object.keys(growth_list).length > 0">
<template v-if="growth_list[row.id] && growth_list[row.id][field]"> <template v-if="growth_list[row.id] && growth_list[row.id][field]">
<span v-if="growth_list[row.id][field].value > 0" class="growth-text"> <span v-if="growth_list[row.id][field].value > 0" class="growth-text">
<span class="growth-up"> <span class="growth-up">
<img class="edit_icon" src="@/assets/super/growth-up.svg" alt="" /> <img class="edit_icon" src="@/assets/super/growth-up.svg"/>
{{ growth_list[row.id][field].value }}% {{ growth_list[row.id][field].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-else-if="growth_list[row.id][field].value < 0" class="growth-text"> <span v-else-if="growth_list[row.id][field].value < 0" class="growth-text">
<span class="growth-down"> <span class="growth-down">
<img class="edit_icon" src="@/assets/super/growth-down.svg" alt="" /> <img class="edit_icon" src="@/assets/super/growth-down.svg"/>
{{ growth_list[row.id][field].value }}% {{ growth_list[row.id][field].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-else class="growth-text"> <span v-else class="growth-text">
<img class="edit_icon" src="@/assets/super/growth-flat.svg" alt="" />同比上年持平 <img class="edit_icon" src="@/assets/super/growth-flat.svg"/>同比上年持平
</span> </span>
</template> </template>
<span v-else class="growth-text">上年无数据</span> <span v-else class="growth-text">上年无数据</span>
</template> </template>
<img @click="handleClick(row, $index, 'id')" v-if="show_detail_index == row.sort" class="detail_icon" src="@/assets/super/list-detail.svg" alt=""> <img v-if="show_detail_index == row.sort"
@click="handleClick(row, $index, 'id')"
class="detail_icon" src="@/assets/super/list-detail.svg">
</div> </div>
</el-popover> </el-popover>
</template> </template>
@ -94,21 +139,19 @@
<template v-if="growth_list[scope.row.id] && growth_list[scope.row.id][field]"> <template v-if="growth_list[scope.row.id] && growth_list[scope.row.id][field]">
<span v-if="growth_list[scope.row.id][field].value > 0" class="growth-text"> <span v-if="growth_list[scope.row.id][field].value > 0" class="growth-text">
<span class="growth-up"> <span class="growth-up">
<img class="edit_icon" src="@/assets/super/growth-up.svg" alt="" /> <img class="edit_icon" src="@/assets/super/growth-up.svg"/>
{{ growth_list[scope.row.id][field].value }}% {{ growth_list[scope.row.id][field].value }}%
</span>同比上年
</span> </span>
同比上年 <span v-else-if="growth_list[scope.row.id][field].value < 0"
</span> class="growth-text">
<span v-else-if="growth_list[scope.row.id][field].value < 0" class="growth-text">
<span class="growth-down"> <span class="growth-down">
<img class="edit_icon" src="@/assets/super/growth-down.svg" alt="" /> <img class="edit_icon" src="@/assets/super/growth-down.svg"/>
{{ growth_list[scope.row.id][field].value }}% {{ growth_list[scope.row.id][field].value }}%
</span> </span>同比上年
同比上年
</span> </span>
<span v-else class="growth-text"> <span v-else class="growth-text">
<img class="edit_icon" src="@/assets/super/growth-flat.svg" alt="" /> <img class="edit_icon" src="@/assets/super/growth-flat.svg"/>同比上年持平
同比上年持平
</span> </span>
</template> </template>
<span v-else class="growth-text">上年无数据</span> <span v-else class="growth-text">上年无数据</span>
@ -117,8 +160,12 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange' <el-pagination background
:current-page="currentPage" :page-size=pageSize layout="prev, pager, next,jumper" @size-change='handleSizeChange'
@current-change='handleCurrentChange'
:current-page="currentPage"
:page-size=pageSize
layout="prev, pager, next,jumper"
:total="total"> :total="total">
</el-pagination> </el-pagination>
</el-form> </el-form>
@ -126,7 +173,6 @@
</div> </div>
</template> </template>
<script> <script>
// import GuipForm from '@/components/GuipForm.vue'
import DateSelect from '@/components/super/DateSelect.vue'; import DateSelect from '@/components/super/DateSelect.vue';
import CustomDropdown from '@/components/CustomDropdown.vue'; import CustomDropdown from '@/components/CustomDropdown.vue';
@ -152,37 +198,37 @@ export default {
}, },
data() { data() {
return { return {
viewDesc:{ viewDesc: {
'month':'月份', 'month': '月份',
'monthTwo':'月份', 'monthTwo': '月份',
'year':'年份', 'year': '年份',
}, },
rank_type_desc:{ rank_type_desc: {
1:'毛利润/元', 1: '毛利润/元',
2:'订单数', 2: '订单数',
3:'退单数', 3: '退单数',
4:'充值金额', 4: '充值金额',
}, },
type_desc:{ type_desc: {
'agent':'代理商昵称', 'agent': '代理商昵称',
'ver_type':'品牌名称', 'ver_type': '品牌名称',
'check_type':'服务名称', 'check_type': '服务名称',
}, },
type_select:{ type_select: {
'ver_type':'按品牌名称', 'ver_type': '按品牌名称',
'check_type':'按服务名称', 'check_type': '按服务名称',
}, },
selectedType: 'check_type', selectedType: 'check_type',
view:'month', view: 'month',
labels:['','','',''], labels: ['', '', '', ''],
valueFields:['value_1','value_2','value_3','value_4'], valueFields: ['value_1', 'value_2', 'value_3', 'value_4'],
currentPage: 1, //当前页 currentPage: 1, //当前页
pageSize: 20, //每页的容量 pageSize: 20, //每页的容量
total: 0, //列表总数 total: 0, //列表总数
sortBy: 4, sortBy: 4,
sortOrder: 2, sortOrder: 2,
text:'',//下拉框显示具体文案 text: '',//下拉框显示具体文案
selectedDate:new Date(),//默认当天日期 selectedDate: new Date(),//默认当天日期
dataType: '', dataType: '',
dataRank: '', dataRank: '',
tableData: [], tableData: [],
@ -195,46 +241,44 @@ export default {
mounted() { mounted() {
this.init() this.init()
}, },
computed: { computed: {},
},
watch: { watch: {
'$route'() { '$route'() {
this.init() this.init()
} }
}, },
methods: { methods: {
init(){ init() {
this.text = this.getNowDate()//初始赋值 this.text = this.getNowDate()
this.dataType = this.type this.dataType = this.type
this.dataRank = this.rank_type this.dataRank = this.rank_type
this.getRankingData(); // 每次路由变化都重新获取数据 this.getRankingData();
}, },
handleUpdateView(newView) { handleUpdateView(newView) {
this.view = newView; this.view = newView;
}, },
getNowDate(){ getNowDate() {
const now = new Date(); const now = new Date();
const year = now.getFullYear(); const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始，补零 const month = String(now.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始，补零
const currentYearMonth = `${year}-${month}`; const currentYearMonth = `${year}-${month}`;
return `${currentYearMonth}` return `${currentYearMonth}`
}, },
getDate(dateStr){ getDate(dateStr) {
const date = new Date(dateStr); const date = new Date(dateStr);
const year = date.getFullYear(); // 2025 const year = date.getFullYear(); // 2025
const month = date.getMonth() + 1; // 3 (表示3月) const month = date.getMonth() + 1; // 3 (表示3月)
if(this.view == 'year'){ if (this.view == 'year') {
return `${year}` return `${year}`
}else{ } else {
return `${year}-${month}` return `${year}-${month}`
} }
}, },
handleDateChange(date) { handleDateChange(date) {
this.text = this.getDate(date) this.text = this.getDate(date)
this.selectedDate = date; this.selectedDate = date;
localStorage.setItem('date',JSON.stringify(date)) localStorage.setItem('date', JSON.stringify(date))
this.$refs.dropdownRef.closeDropdown(); this.$refs.dropdownRef.closeDropdown();
@ -245,13 +289,13 @@ export default {
let query = {} let query = {}
query.date = this.text query.date = this.text
query.rank_type = this.dataRank query.rank_type = this.dataRank
if(this.dataType == 'agent') { if (this.dataType == 'agent') {
query.aid = id query.aid = id
} }
if(this.dataType == 'ver_type') { if (this.dataType == 'ver_type') {
query.ver_type = id query.ver_type = id
} }
if(this.dataType == 'check_type') { if (this.dataType == 'check_type') {
query.check_type = id query.check_type = id
} }
window.open(this.$router.resolve({ window.open(this.$router.resolve({
@ -259,7 +303,7 @@ export default {
query: query query: query
}).href, '_blank') }).href, '_blank')
}, },
closePop(row,type){ closePop(row, type) {
row[type + '_popover'] = false; // 关闭弹框 row[type + '_popover'] = false; // 关闭弹框
}, },
handleClick(row, index, type) { handleClick(row, index, type) {
@ -273,13 +317,13 @@ export default {
row[type + '_popover'] = true; row[type + '_popover'] = true;
let obj = {} let obj = {}
if(this.dataType == 'agent') { if (this.dataType == 'agent') {
obj.aid = row.id obj.aid = row.id
} }
if(this.dataType == 'ver_type') { if (this.dataType == 'ver_type') {
obj.ver_type = row.id obj.ver_type = row.id
} }
if(this.dataType == 'check_type') { if (this.dataType == 'check_type') {
obj.check_type = row.id obj.check_type = row.id
} }
this.getRankingDetail(obj); this.getRankingDetail(obj);
@ -295,7 +339,7 @@ export default {
item.removeAttribute('aria-hidden') item.removeAttribute('aria-hidden')
}) })
}, },
handleSortChange({ prop, order }) { handleSortChange({prop, order}) {
this.sortBy = 4; this.sortBy = 4;
this.sortOrder = 2; this.sortOrder = 2;
if (order == 'ascending') { if (order == 'ascending') {
@ -312,27 +356,31 @@ export default {
handleRowHover(row) { handleRowHover(row) {
this.show_detail_index = row.sort this.show_detail_index = row.sort
}, },
changeRankType(){ changeRankType() {
this.dataType = this.selectedType this.dataType = this.selectedType
this.getRankingData() this.getRankingData()
}, },
getRankingData() { getRankingData() {
this.setLabelText(); this.setLabelText();
if(this.dataType == 'agent') { if (this.dataType == 'agent') {
if (this.dataRank == 4) {
this.getAgentRecharge()
} else {
this.getAgentRanking() this.getAgentRanking()
} }
if(this.dataType == 'ver_type') { }
if (this.dataType == 'ver_type') {
this.getVerRanking() this.getVerRanking()
} }
if(this.dataType == 'check_type') { if (this.dataType == 'check_type') {
this.getTypeRanking() this.getTypeRanking()
} }
}, },
setLabelText(){ setLabelText() {
const date = new Date(this.text); const date = new Date(this.text);
const year = date.getFullYear(); // 2025 const year = date.getFullYear();
const month = date.getMonth() + 1; // 3 (表示3月) const month = date.getMonth() + 1;
this.labels = []; this.labels = [];
if (this.view === 'year') { if (this.view === 'year') {
@ -350,11 +398,11 @@ export default {
} }
}, },
getAgentRanking() { getAgentRanking() {
//代理商排行
const that = this const that = this
//充值排行 this.$http('POST', '/supernew/ajax_get_agent_batch_list', {
if(that.dataRank == 4){
this.$http('POST', '/supernew/ajax_get_rank_recharge', {
date: that.text, date: that.text,
rank_type: that.dataRank,
sortBy: that.sortBy, sortBy: that.sortBy,
sortOrder: that.sortOrder, sortOrder: that.sortOrder,
cur_page: that.currentPage, cur_page: that.currentPage,
@ -368,12 +416,12 @@ export default {
}).catch(error => { }).catch(error => {
console.error(error, 'error') console.error(error, 'error')
}) })
return },
} getAgentRecharge() {
//充值排行
this.$http('POST', '/supernew/ajax_get_agent_batch_list', { const that = this
this.$http('POST', '/supernew/ajax_get_rank_recharge', {
date: that.text, date: that.text,
rank_type: that.dataRank,
sortBy: that.sortBy, sortBy: that.sortBy,
sortOrder: that.sortOrder, sortOrder: that.sortOrder,
cur_page: that.currentPage, cur_page: that.currentPage,
@ -389,6 +437,7 @@ export default {
}) })
}, },
getVerRanking() { getVerRanking() {
//品牌排行
const that = this const that = this
this.$http('POST', '/supernew/ajax_get_ver_batch_list', { this.$http('POST', '/supernew/ajax_get_ver_batch_list', {
date: that.text, date: that.text,
@ -409,6 +458,7 @@ export default {
}) })
}, },
getTypeRanking() { getTypeRanking() {
//产品排行
const that = this const that = this
this.$http('POST', '/supernew/ajax_get_type_batch_list', { this.$http('POST', '/supernew/ajax_get_type_batch_list', {
date: that.text, date: that.text,
@ -459,32 +509,40 @@ export default {
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.growth-up{ .growth-up {
padding: 0 5px; padding: 0 5px;
color:#22C55E; color: #22C55E;
} }
.growth-down{
.growth-down {
padding: 0 5px; padding: 0 5px;
color:#EF4444; color: #EF4444;
} }
.growth-text{
color:#9CA3AF; .growth-text {
color: #9CA3AF;
padding-left: 5px; padding-left: 5px;
} }
.edit_icon{
.edit_icon {
padding: 0 5px; padding: 0 5px;
vertical-align: middle; vertical-align: middle;
} }
.demo-wrap { .demo-wrap {
width: 100%; width: 100%;
letter-spacing: 0.08em; letter-spacing: 0.08em;
} }
.custom-select { .custom-select {
width: 120px; width: 210px;
border: none; border: none;
border-radius: 0; border-radius: 0;
font-size: 14px; font-size: 14px;
line-height: 18px;
height: 30px;
} }
.custom-select ::v-deep(.el-input__inner) { .custom-select ::v-deep(.el-input__inner) {
background: none; background: none;
border: 1px solid transparent; border: 1px solid transparent;
@ -495,12 +553,49 @@ export default {
font-weight: bold; font-weight: bold;
padding: 0; padding: 0;
} }
.custom-select ::v-deep(.el-input:focus-within) { .custom-select ::v-deep(.el-input:focus-within) {
background: none; background: none;
border-color: #F5F7FA!important; border-color: #F5F7FA !important;
border-radius: 0; border-radius: 0;
box-shadow: none; box-shadow: none;
outline:none; outline: none;
}
.el-select-dropdown__item {
color: #1E2226;
margin: 0 12px;
padding: 0 12px;
}
.el-select-dropdown__item:first-child {
margin-top: 6px;
}
.el-select-dropdown__item:last-child {
margin-bottom: 6px;
}
.el-select-dropdown__item:hover {
background: #F6F7FA;
}
.el-select-dropdown__item.selected {
font-weight: normal;
}
.el-select-dropdown__item.selected::after {
content: "";
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
width: 16px;
height: 16px;
background-image: url('../../../assets/super/select-active.svg');
background-size: contain;
background-repeat: no-repeat;
opacity: 1;
} }
.detail_icon { .detail_icon {
@ -511,22 +606,15 @@ export default {
::v-deep .el-popover.el-popper { ::v-deep .el-popover.el-popper {
padding: 20px; padding: 20px;
} }
.pop-wrap { .pop-wrap {
// width: 596px;
// height: 320px;
/* 自动布局 */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// padding: 20px;
gap: 20px; gap: 20px;
box-sizing: border-box; box-sizing: border-box;
// background: #FFFFFF;
/* 阴影/常规阴影 */
// box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
.pop-top { .pop-top {
h3 { h3 {
/* body/body 1_bold */
font-family: Microsoft YaHei UI; font-family: Microsoft YaHei UI;
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
@ -543,7 +631,8 @@ export default {
color: #006AFF; color: #006AFF;
} }
} }
img{
img {
width: 20px; width: 20px;
height: 20px; height: 20px;
} }

245
src/views/super/Ranking/RankDetail.vue
View File

@ -1,21 +1,34 @@
<template> <template>
<div class="demo-wrap min-flex-right"> <div class="demo-wrap min-flex-right">
<div class="flex-between"> <div class="flex-between">
<h2>{{filterTitle ? filterTitle : pageTitle}}</h2> <h2>{{ filterTitle ? filterTitle : pageTitle }}</h2>
<CustomDropdown ref="dropdownRef" :placeholder="'（'+viewDesc[this.view]+')'+text" width="280px" v-if="showDateSelect"> <CustomDropdown v-if="showDateSelect"
<DateSelect slot="normal" :view="view" :onlyYear="onlyYear" v-model="selectedDate" @update-count="handleUpdateView" @change="handleDateChange" /> ref="dropdownRef"
:placeholder="'（'+viewDesc[this.view]+')'+text"
width="280px">
<DateSelect slot="normal"
:view="view"
:onlyYear="onlyYear"
v-model="selectedDate"
@update-count="handleUpdateView"
@change="handleDateChange"/>
</CustomDropdown> </CustomDropdown>
</div> </div>
<div class=" flex-common" v-if="type == 'year'"> <div class=" flex-common" v-if="type == 'year'">
<el-form> <el-form>
<el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" @cell-mouse-enter="handleRowHover"> <el-table :data="tableData"
style="width: 100%"
@sort-change="handleSortChange"
@cell-mouse-enter="handleRowHover">
<el-table-column prop="sort" label="排序" width="100"></el-table-column> <el-table-column prop="sort" label="排序" width="100"></el-table-column>
<!-- 其他列 -->
<el-table-column prop="1" label="年份" sortable="custom"> <el-table-column prop="1" label="年份" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.value_1 }} {{ scope.row.value_1 }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="2" :label="rank_type_desc[dataRank]" sortable="custom"> <el-table-column prop="2" :label="rank_type_desc[dataRank]" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.value_2 }} {{ scope.row.value_2 }}
@ -24,11 +37,21 @@
<el-table-column label="代理商排行"> <el-table-column label="代理商排行">
<template v-slot="{ row, $index }"> <template v-slot="{ row, $index }">
<el-popover v-model="row.id_popover" placement="top" trigger="manual" :ref="`popover-${$index}`" @show="popshow"> <el-popover v-model="row.id_popover"
placement="top"
trigger="manual"
:ref="`popover-${$index}`"
@show="popshow">
<div class="pop-wrap"> <div class="pop-wrap">
<div class="flex-between flex pop-top"> <div class="flex-between flex pop-top">
<h3>{{ row.value_1 }} {{rank_type_desc[dataRank]}}<span @click="goLookMoreData(row.value_1)">查看更多</span></h3> <h3>
<span class="flex point" @click="closePop(row,'id')">关闭 <img src="@/assets/register/close.svg" alt=""></span> {{ row.value_1 }} {{ rank_type_desc[dataRank] }}
<span @click="goLookMoreData(row.value_1)">查看更多</span>
</h3>
<span class="flex point" @click="closePop(row,'id')">
关闭<img src="@/assets/register/close.svg">
</span>
</div> </div>
<el-table :data="tableData1" style="width: 100%"> <el-table :data="tableData1" style="width: 100%">
<el-table-column prop="sort" width="100" label="排行"></el-table-column> <el-table-column prop="sort" width="100" label="排行"></el-table-column>
@ -36,11 +59,15 @@
<el-table-column prop="value_1" width="348" label="销售额"></el-table-column> <el-table-column prop="value_1" width="348" label="销售额"></el-table-column>
</el-table> </el-table>
</div> </div>
<!-- 触发弹框的按钮 -->
<span v-if="top_list[row.id]" slot="reference" > <span v-if="top_list[row.id]" slot="reference">
No.1 {{ top_list[row.id]['name'] }} No.1 {{ top_list[row.id]['name'] }}
<img @click="handleClick(row, $index, 'id')" v-if="show_detail_index == row.sort" class="detail_icon" src="@/assets/super/list-detail.svg" alt=""> <img v-if="show_detail_index == row.sort"
@click="handleClick(row, $index, 'id')"
class="detail_icon"
src="@/assets/super/list-detail.svg">
</span> </span>
<span v-else slot="reference">暂无排行</span>
</el-popover> </el-popover>
</template> </template>
</el-table-column> </el-table-column>
@ -50,9 +77,13 @@
<div class=" flex-common" v-if="type == 'month'"> <div class=" flex-common" v-if="type == 'month'">
<el-form> <el-form>
<el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" @cell-mouse-enter="handleRowHover"> <el-table :data="tableData"
style="width: 100%"
@sort-change="handleSortChange"
@cell-mouse-enter="handleRowHover">
<el-table-column prop="sort" label="排序" width="100"></el-table-column> <el-table-column prop="sort" label="排序" width="100"></el-table-column>
<!-- 其他列 -->
<el-table-column prop="1" label="月份" sortable="custom"> <el-table-column prop="1" label="月份" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.value_1 }} {{ scope.row.value_1 }}
@ -63,19 +94,21 @@
<template slot-scope="scope"> <template slot-scope="scope">
<div class="flex"> <div class="flex">
{{ scope.row.value_2 }} {{ scope.row.value_2 }}
<span class="flex growth-text" v-if="growth_list[scope.row.id]"> <span v-if="growth_list[scope.row.id]" class="flex growth-text">
<span v-if="growth_list[scope.row.id].value>0"> <span v-if="growth_list[scope.row.id].value>0">
<span class="growth-up"> <span class="growth-up">
<img class="edit_icon" src="@/assets/super/growth-up.svg" alt="">{{growth_list[scope.row.id].value}}% <img class="edit_icon" src="@/assets/super/growth-up.svg">
{{ growth_list[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list[scope.row.id].value<0"> <span v-if="growth_list[scope.row.id].value<0">
<span class="growth-down"> <span class="growth-down">
<img class="edit_icon" src="@/assets/super/growth-down.svg" alt="">{{growth_list[scope.row.id].value}}% <img class="edit_icon" src="@/assets/super/growth-down.svg">
{{ growth_list[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list[scope.row.id].value==0"> <span v-if="growth_list[scope.row.id].value==0">
<img class="edit_icon" src="@/assets/super/growth-flat.svg" alt="">同比上年持平 <img class="edit_icon" src="@/assets/super/growth-flat.svg">同比上年持平
</span> </span>
</span> </span>
<span class="flex growth-text" v-else>上年无数据</span> <span class="flex growth-text" v-else>上年无数据</span>
@ -85,11 +118,20 @@
<el-table-column label="代理商排行"> <el-table-column label="代理商排行">
<template v-slot="{ row, $index }"> <template v-slot="{ row, $index }">
<el-popover v-model="row.id_popover" placement="top" trigger="manual" :ref="`popover-${$index}`" @show="popshow"> <el-popover v-model="row.id_popover"
placement="top"
trigger="manual"
:ref="`popover-${$index}`"
@show="popshow">
<div class="pop-wrap"> <div class="pop-wrap">
<div class="flex-between flex pop-top"> <div class="flex-between flex pop-top">
<h3>{{ row.value_1 }} {{rank_type_desc[dataRank]}}<span @click="goLookMoreData(row.value_1)">查看更多</span></h3> <h3>
<span class="flex point" @click="closePop(row,'id')">关闭 <img src="@/assets/register/close.svg" alt=""></span> {{ row.value_1 }} {{ rank_type_desc[dataRank] }}
<span @click="goLookMoreData(row.value_1)">查看更多</span>
</h3>
<span class="flex point" @click="closePop(row,'id')">
关闭<img src="@/assets/register/close.svg">
</span>
</div> </div>
<el-table :data="tableData1" style="width: 100%"> <el-table :data="tableData1" style="width: 100%">
<el-table-column prop="sort" width="100" label="排行"></el-table-column> <el-table-column prop="sort" width="100" label="排行"></el-table-column>
@ -97,12 +139,13 @@
<el-table-column prop="value_1" width="348" label="销售额"></el-table-column> <el-table-column prop="value_1" width="348" label="销售额"></el-table-column>
</el-table> </el-table>
</div> </div>
<!-- 触发弹框的按钮 -->
<span v-if="top_list[row.id]" slot="reference"> <span v-if="top_list[row.id]" slot="reference">
No.1 {{ top_list[row.id]['name'] }} No.1 {{ top_list[row.id]['name'] }}
<img @click="handleClick(row, $index, 'id')" v-if="show_detail_index == row.sort" class="detail_icon" src="@/assets/super/list-detail.svg" alt=""> <img v-if="show_detail_index == row.sort"
@click="handleClick(row, $index, 'id')"
class="detail_icon" src="@/assets/super/list-detail.svg">
</span> </span>
<span slot="reference" v-else>暂无排行</span> <span v-else slot="reference">暂无排行</span>
</el-popover> </el-popover>
</template> </template>
</el-table-column> </el-table-column>
@ -113,13 +156,17 @@
<div class=" flex-common" v-if="type == 'day'"> <div class=" flex-common" v-if="type == 'day'">
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;"> <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
<h3 style="margin: 0;"></h3> <h3 style="margin: 0;"></h3>
<span style="font-size: 14px; color: #999;">总{{rank_type_desc[dataRank]}}：{{total_value}}</span> <span style="font-size: 14px; color: #999;">总{{ rank_type_desc[dataRank] }}：{{ total_value }}</span>
</div> </div>
<el-form> <el-form>
<el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" @cell-mouse-enter="handleRowHover"> <el-table :data="tableData"
style="width: 100%"
@sort-change="handleSortChange"
@cell-mouse-enter="handleRowHover">
<el-table-column prop="sort" label="排序"></el-table-column> <el-table-column prop="sort" label="排序"></el-table-column>
<!-- 其他列 -->
<el-table-column prop="1" label="日期" sortable="custom"> <el-table-column prop="1" label="日期" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.value_1 }} {{ scope.row.value_1 }}
@ -131,22 +178,24 @@
<div class="flex"> <div class="flex">
{{ scope.row.value_2 }} {{ scope.row.value_2 }}
<template v-if="Object.keys(growth_list).length > 0"> <template v-if="Object.keys(growth_list).length > 0">
<span class="flex growth-text" v-if="growth_list[scope.row.id]"> <span v-if="growth_list[scope.row.id]" class="flex growth-text">
<span v-if="growth_list[scope.row.id].value>0"> <span v-if="growth_list[scope.row.id].value>0">
<span class="growth-up"> <span class="growth-up">
<img class="edit_icon" src="@/assets/super/growth-up.svg" alt="">{{growth_list[scope.row.id].value}}% <img class="edit_icon" src="@/assets/super/growth-up.svg">
{{ growth_list[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list[scope.row.id].value<0"> <span v-if="growth_list[scope.row.id].value<0">
<span class="growth-down"> <span class="growth-down">
<img class="edit_icon" src="@/assets/super/growth-down.svg" alt="">{{growth_list[scope.row.id].value}}% <img class="edit_icon" src="@/assets/super/growth-down.svg">
{{ growth_list[scope.row.id].value }}%
</span>同比上年 </span>同比上年
</span> </span>
<span v-if="growth_list[scope.row.id].value==0"> <span v-if="growth_list[scope.row.id].value==0">
<img class="edit_icon" src="@/assets/super/growth-flat.svg" alt="">同比上年持平 <img class="edit_icon" src="@/assets/super/growth-flat.svg">同比上年持平
</span> </span>
</span> </span>
<span class="flex growth-text" v-else>上年无数据</span> <span v-else class="flex growth-text">上年无数据</span>
</template> </template>
</div> </div>
</template> </template>
@ -157,20 +206,27 @@
<div class=" flex-common" v-if="type == 'agentnew'"> <div class=" flex-common" v-if="type == 'agentnew'">
<el-form> <el-form>
<el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" @cell-mouse-enter="handleRowHover"> <el-table :data="tableData"
style="width: 100%"
@sort-change="handleSortChange"
@cell-mouse-enter="handleRowHover">
<el-table-column prop="1" label="加盟时间" sortable="custom"> <el-table-column prop="1" label="加盟时间" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.regtime }} {{ scope.row.regtime }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="nick" label="代理商昵称"></el-table-column> <el-table-column prop="nick" label="代理商昵称"></el-table-column>
<el-table-column prop="real_name" label="负责人"></el-table-column> <el-table-column prop="real_name" label="负责人"></el-table-column>
<el-table-column prop="phone" label="电话"></el-table-column> <el-table-column prop="phone" label="电话"></el-table-column>
<el-table-column prop="2" label="账户余额" sortable="custom"> <el-table-column prop="2" label="账户余额" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.remain_money }} {{ scope.row.remain_money }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="3" label="累计总额/元" sortable="custom"> <el-table-column prop="3" label="累计总额/元" sortable="custom">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.total_money }} {{ scope.row.total_money }}
@ -182,7 +238,6 @@
</div> </div>
</template> </template>
<script> <script>
// import GuipForm from '@/components/GuipForm.vue'
import DateSelect from '@/components/super/DateSelect.vue'; import DateSelect from '@/components/super/DateSelect.vue';
import CustomDropdown from '@/components/CustomDropdown.vue'; import CustomDropdown from '@/components/CustomDropdown.vue';
@ -212,26 +267,26 @@ export default {
}, },
data() { data() {
return { return {
viewDesc:{ viewDesc: {
'month':'月份', 'month': '月份',
'monthTwo':'月份', 'monthTwo': '月份',
'year':'年份', 'year': '年份',
}, },
rank_type_desc:{ rank_type_desc: {
1:'毛利润/元', 1: '毛利润/元',
2:'订单数', 2: '订单数',
3:'退单数', 3: '退单数',
}, },
aid:0, aid: 0,
ver_type:0, ver_type: 0,
check_type:0, check_type: 0,
showfilterTitle:false, showfilterTitle: false,
filterTitle:"", filterTitle: "",
view:'year', view: 'year',
onlyYear:true, onlyYear: true,
dataRank:'', dataRank: '',
text:'',//下拉框显示具体文案 text: '',//下拉框显示具体文案
selectedDate:new Date(),//默认当天日期 selectedDate: new Date(),//默认当天日期
tableData: [], tableData: [],
total_value: 0, total_value: 0,
tableData1: [], tableData1: [],
@ -243,56 +298,53 @@ export default {
mounted() { mounted() {
this.init() this.init()
}, },
computed: { computed: {},
},
watch: { watch: {
'$route'() { '$route'() {
this.init() this.init()
} }
}, },
methods: { methods: {
init(){ init() {
if(this.showDateSelect){ this.text = ""
this.text = this.getNowYear()//初始赋值 if (this.showDateSelect) this.text = this.getNowYear()
}
this.dataRank = this.rank_type this.dataRank = this.rank_type
this.aid = this.$route.query.aid this.aid = this.$route.query.aid
this.ver_type = this.$route.query.ver_type this.ver_type = this.$route.query.ver_type
this.check_type = this.$route.query.check_type this.check_type = this.$route.query.check_type
if(this.$route.query.date) this.text = this.$route.query.date if (this.$route.query.date) this.text = this.$route.query.date
if(this.$route.query.rank_type) this.dataRank = this.$route.query.rank_type if (this.$route.query.rank_type) this.dataRank = this.$route.query.rank_type
if(Object.keys(this.$route.query).length > 0) this.showfilterTitle = true if (Object.keys(this.$route.query).length > 0) this.showfilterTitle = true
if(this.type == 'agentnew'){ if (this.type == 'agentnew') {
this.getAgentNew() this.getAgentNew()
return } else {
}
this.getRankingDetail() this.getRankingDetail()
}
}, },
handleUpdateView(newView) { handleUpdateView(newView) {
this.view = newView; this.view = newView;
}, },
getNowYear(){ getNowYear() {
const now = new Date(); const now = new Date();
const year = now.getFullYear(); const year = now.getFullYear();
const currentYearMonth = `${year}`; const currentYearMonth = `${year}`;
return `${currentYearMonth}` return `${currentYearMonth}`
}, },
getDate(dateStr){ getDate(dateStr) {
const date = new Date(dateStr); const date = new Date(dateStr);
const year = date.getFullYear(); // 2025 const year = date.getFullYear(); // 2025
const month = date.getMonth() + 1; // 3 (表示3月) const month = date.getMonth() + 1; // 3 (表示3月)
if(this.view == 'year'){ if (this.view == 'year') {
return `${year}` return `${year}`
}else{ } else {
return `${year}-${month}` return `${year}-${month}`
} }
}, },
handleDateChange(date) { handleDateChange(date) {
this.text = this.getDate(date) this.text = this.getDate(date)
this.selectedDate = date; this.selectedDate = date;
localStorage.setItem('date',JSON.stringify(date)) localStorage.setItem('date', JSON.stringify(date))
this.$refs.dropdownRef.closeDropdown(); this.$refs.dropdownRef.closeDropdown();
this.getRankingDetail() this.getRankingDetail()
@ -307,7 +359,7 @@ export default {
query: query query: query
}).href, '_blank') }).href, '_blank')
}, },
closePop(row,type){ closePop(row, type) {
row[type + '_popover'] = false; // 关闭弹框 row[type + '_popover'] = false; // 关闭弹框
}, },
handleClick(row, index, type) { handleClick(row, index, type) {
@ -319,7 +371,8 @@ export default {
}); });
// 打开当前行的弹框 // 打开当前行的弹框
row[type + '_popover'] = true; row[type + '_popover'] = true;
this.getRankingList({date:row.value_1});
this.getRankingList({date: row.value_1});
}, },
popshow() { popshow() {
var ariaEls = document.querySelectorAll('.el-popover') var ariaEls = document.querySelectorAll('.el-popover')
@ -332,7 +385,7 @@ export default {
item.removeAttribute('aria-hidden') item.removeAttribute('aria-hidden')
}) })
}, },
handleSortChange({ prop, order }) { handleSortChange({prop, order}) {
this.currentPage = 1; this.currentPage = 1;
let sortBy = 0; let sortBy = 0;
@ -345,23 +398,23 @@ export default {
sortBy = prop; sortBy = prop;
sortOrder = 2; sortOrder = 2;
} }
if(this.type == 'agentnew'){ if (this.type == 'agentnew') {
this.getAgentNew({ sortBy: sortBy, sortOrder: sortOrder }) this.getAgentNew({sortBy: sortBy, sortOrder: sortOrder})
return return
} }
this.getRankingDetail({ sortBy: sortBy, sortOrder: sortOrder }) this.getRankingDetail({sortBy: sortBy, sortOrder: sortOrder})
}, },
handleRowHover(row) { handleRowHover(row) {
this.show_detail_index = row.sort this.show_detail_index = row.sort
}, },
getRankingDetail(obj) { getRankingDetail(obj) {
const that = this const that = this
that.tableData1 = [] that.tableData = []
this.$http('POST', '/supernew/ajax_get_rank_detail', { this.$http('POST', '/supernew/ajax_get_rank_detail', {
rank_type: that.dataRank, rank_type: that.dataRank,
aid:that.aid, aid: that.aid,
ver_type:that.ver_type, ver_type: that.ver_type,
check_type:that.check_type, check_type: that.check_type,
date: that.text, date: that.text,
...obj ...obj
}).then(response => { }).then(response => {
@ -372,7 +425,7 @@ export default {
that.growth_list = response.data.growth_list that.growth_list = response.data.growth_list
that.total = response.data.total that.total = response.data.total
if(that.showfilterTitle) that.filterTitle = response.data.title if (that.showfilterTitle) that.filterTitle = response.data.title
}) })
}).catch(error => { }).catch(error => {
console.error(error, 'error') console.error(error, 'error')
@ -380,6 +433,7 @@ export default {
}, },
getRankingList(obj) { getRankingList(obj) {
const that = this const that = this
that.tableData1 = []
this.$http('POST', '/supernew/ajax_get_agent_rank_list', { this.$http('POST', '/supernew/ajax_get_agent_rank_list', {
rank_type: that.dataRank, rank_type: that.dataRank,
cur_page: 1, cur_page: 1,
@ -395,6 +449,7 @@ export default {
}, },
getAgentNew(obj) { getAgentNew(obj) {
const that = this const that = this
that.tableData = []
this.$http('POST', '/supernew/ajax_new_agent_list', { this.$http('POST', '/supernew/ajax_new_agent_list', {
...obj ...obj
}).then(response => { }).then(response => {
@ -409,22 +464,26 @@ export default {
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.growth-up{ .growth-up {
padding: 0 5px; padding: 0 5px;
color:#22C55E; color: #22C55E;
} }
.growth-down{
.growth-down {
padding: 0 5px; padding: 0 5px;
color:#EF4444; color: #EF4444;
} }
.growth-text{
color:#9CA3AF; .growth-text {
color: #9CA3AF;
padding-left: 5px; padding-left: 5px;
} }
.edit_icon{
.edit_icon {
padding: 0 5px; padding: 0 5px;
vertical-align: middle; vertical-align: middle;
} }
.demo-wrap { .demo-wrap {
width: 100%; width: 100%;
letter-spacing: 0.08em; letter-spacing: 0.08em;
@ -438,22 +497,15 @@ export default {
::v-deep .el-popover.el-popper { ::v-deep .el-popover.el-popper {
padding: 20px; padding: 20px;
} }
.pop-wrap { .pop-wrap {
// width: 596px;
// height: 320px;
/* 自动布局 */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// padding: 20px;
gap: 20px; gap: 20px;
box-sizing: border-box; box-sizing: border-box;
// background: #FFFFFF;
/* 阴影/常规阴影 */
// box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
.pop-top { .pop-top {
h3 { h3 {
/* body/body 1_bold */
font-family: Microsoft YaHei UI; font-family: Microsoft YaHei UI;
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
@ -470,7 +522,8 @@ export default {
color: #006AFF; color: #006AFF;
} }
} }
img{
img {
width: 20px; width: 20px;
height: 20px; height: 20px;
} }

9
src/views/super/Ranking/Ranking.vue
View File

@ -1,7 +1,6 @@
<template> <template>
<div class="siteSetting-wrap"> <div class="siteSetting-wrap">
<RankingLeftMenu /> <RankingLeftMenu />
<!--:menuList="menuList" :activeFloor="activeFloor" :curIndex="curIndex" -->
<!-- 主内容区域 --> <!-- 主内容区域 -->
<main class="main-content" ref="scrollContainer"> <main class="main-content" ref="scrollContainer">
<router-view></router-view> <router-view></router-view>
@ -27,8 +26,6 @@ export default {
}, },
mounted(){ mounted(){
this.path =this.$route.path; this.path =this.$route.path;
console.log(this.$route.path,'090-9090');
// this.$refs.scrollContainer.scrollTo(0)
}, },
methods: { methods: {
} }
@ -40,12 +37,6 @@ export default {
height: 100%; height: 100%;
} }
// .sidebar {
// width: 250px;
// background: #f5f5f5;
// padding: 20px;
// }
.main-content { .main-content {
flex: 1; flex: 1;
padding: 12px; padding: 12px;

Write Preview
Loading…
Cancel
Save