51 lines
1.4 KiB
Vue
51 lines
1.4 KiB
Vue
<template>
|
||
|
||
<div class="flow-select-main">
|
||
<div style="font-size:12px;margin:20px 0;">累计：{{total}}</div>
|
||
|
||
<el-table :data="tableData" :header-cell-style="{'background':'#f6f8fb!important',
|
||
'color':'#495060'}"
|
||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||
<el-table-column label="序号" prop="flow_id" width="180"/>
|
||
<el-table-column label="来源" prop="flow_source" width="180"/>
|
||
<el-table-column label="访问页面" prop="flow_target" width="180"/>
|
||
<el-table-column label="操作系统" prop="flow_os" width="180"/>
|
||
<el-table-column label="访问量" prop="number" width="180"/>
|
||
<el-table-column label="比例" prop="percentage">
|
||
<template #default="scope">
|
||
<div> <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.percentage" /></div>
|
||
<div class="percentage-txt">{{ scope.row.percentage }} %</div>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
|
||
|
||
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import {getFlowSourceCount} from "~/service/flow.js"
|
||
import {reactive,ref} from "vue";
|
||
let tableData = ref([
|
||
])
|
||
let total = ref(0);
|
||
|
||
|
||
function getList() {
|
||
getFlowSourceCount().then((res) => {
|
||
if (res['code'] == 0) {
|
||
tableData.value = res.data['GDP']
|
||
total.value = res['count']
|
||
}
|
||
})
|
||
}
|
||
getList()
|
||
|
||
|
||
</script>
|
||
<style scoped>
|
||
.el-card__body{
|
||
padding-top:20px!important;
|
||
}
|
||
</style> |