Skip to content

Commit 5b99643

Browse files
author
Abhishek Singla
committed
Merge branch 'feature/new-ui' of http://github.com/Countly/countly-server into feature/new-ui-compare-apps
2 parents 9fe2603 + 14caef6 commit 5b99643

File tree

9 files changed

+173
-33
lines changed

9 files changed

+173
-33
lines changed

‎frontend/express/public/core/device-and-type/javascripts/countly.models.js

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -236,17 +236,18 @@
236236
var segmentedDataTotalSession, segmentedDataTotalUsers, segmentedDataNewUsers;
237237

238238
// calculate chartData
239-
var segmentedData = countlyDensity.getOSSegmentedData(countlyCommon.ACTIVE_APP_ID).os;
239+
var segmentedData = countlyDeviceDetails.getPlatformData().chartData;
240240
for (var i = 0; i < segmentedData.length; i++) {
241241
segmentedDataTotalSession = 0;
242242
segmentedDataTotalUsers = 0;
243243
segmentedDataNewUsers = 0;
244-
for (var j = 0; j < countlyDensity.getOSSegmentedData(segmentedData[i].name).chartData.length; j++) {
245-
segmentedDataTotalSession += parseInt(countlyDensity.getOSSegmentedData(segmentedData[i].name).chartData[j].t);
246-
segmentedDataTotalUsers += parseInt(countlyDensity.getOSSegmentedData(segmentedData[i].name).chartData[j].u);
247-
segmentedDataNewUsers += parseInt(countlyDensity.getOSSegmentedData(segmentedData[i].name).chartData[j].n);
244+
var versionsSegmentedData = countlyDensity.getOSSegmentedData(segmentedData[i].os_).chartData;
245+
for (var j = 0; j < versionsSegmentedData.length; j++) {
246+
segmentedDataTotalSession += versionsSegmentedData[j].t;
247+
segmentedDataTotalUsers += versionsSegmentedData[j].u;
248+
segmentedDataNewUsers += versionsSegmentedData[j].n;
248249
}
249-
calculatedchartData.push({density: segmentedData[i].name, t: segmentedDataTotalSession, u: segmentedDataTotalUsers, n: segmentedDataNewUsers});
250+
calculatedchartData.push({density: segmentedData[i].os_, t: segmentedDataTotalSession, u: segmentedDataTotalUsers, n: segmentedDataNewUsers});
250251
}
251252
chartData.chartData = calculatedchartData;
252253

‎plugins/browser/frontend/public/stylesheets/browser.scss

Lines changed: 59 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,11 +50,10 @@
5050
}
5151
}
5252

53-
.cly-vue-metric-card {
54-
width: fit-content !important;
55-
}
56-
5753
&__browser-versions-wrapper {
54+
height: 309px;
55+
padding-bottom: 20px;
56+
5857
.__view {
5958
width:auto !important;
6059
display: flex;
@@ -91,4 +90,60 @@
9190
margin-bottom: 2px;
9291
}
9392
}
93+
94+
&__empty-card {
95+
min-height: 107px;
96+
border-left: 1px solid #ececec;
97+
width: 100%;
98+
position: relative;
99+
background-color: #ffffff;
100+
top: 50%;
101+
text-align: center;
102+
103+
div {
104+
position: absolute;
105+
top: 50%;
106+
text-align: center;
107+
width: 100%;
108+
}
109+
}
110+
111+
&__versions-empty-card {
112+
min-height: 250px;
113+
border-left: 1px solid #ececec;
114+
width: 100%;
115+
position: relative;
116+
background-color: #ffffff;
117+
border-top: 1px solid #ececec;
118+
border-right: 1px solid #ececec;
119+
120+
div {
121+
position: absolute;
122+
top: 50%;
123+
text-align: center;
124+
width: 100%;
125+
}
126+
}
127+
128+
&__metric-cards-wrapper {
129+
height: 115px;
130+
min-height: 107px;
131+
width: 100%;
132+
position:relative;
133+
134+
.__view {
135+
width: auto !important;
136+
}
137+
.cly-vue-metric-card {
138+
background-color: #fff;
139+
border-top: 1px solid #ececec;
140+
border-bottom: 1px solid #ececec;
141+
}
142+
.cly-vue-metric-cards {
143+
flex-wrap: nowrap;
144+
}
145+
.cly-vue-metric-card__wrapper {
146+
margin-right: -1.5rem;
147+
}
148+
}
94149
}

‎plugins/browser/frontend/public/templates/browser.html

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,29 +16,32 @@ <h2> {{i18n('browser.title')}}
1616
</template>
1717
</cly-header>
1818
<cly-main>
19-
<cly-date-picker-g class="technology-analytics-wrapper-browser__date-picker"></cly-date-picker-g>
19+
<cly-date-picker-g class="bu-mb-5"></cly-date-picker-g>
2020
<div class="bu-columns bu-is-gapless">
2121
<h4>{{i18n('browser.browser-for')}}</h4>
2222
<div class ="selector_wrapper">
23-
<el-select v-model="selectedProperty">
23+
<el-select v-model="selectedProperty" :arrow="false" :adaptiveLength="true">
2424
<el-option :key="item.value" :value="item.value" :label="item.name" v-for="item in chooseProperties"></el-option>
2525
</el-select>
2626
</div>
2727
</div>
28-
<div class="bu-mb-4 technology-analytics-wrapper-browser__metric-cards-wrapper">
28+
<div class="bu-pb-4 technology-analytics-wrapper-browser__metric-cards-wrapper">
2929
<vue-scroll :ops="scrollCards" ref="topSlider" @handle-scroll="handleCardsScroll">
3030
<cly-metric-cards class="bu-is-flex-wrap-nowrap">
31-
<cly-metric-card :is-percentage="true" class="bg-white" :columnWidth=3 :color="item.color" :number="item.percent" :key="idx" v-for="(item, idx) in browserItems">
31+
<cly-metric-card :is-percentage="true" :columnWidth=3 :color="item.color" :number="item.percent" :key="idx" v-for="(item, idx) in browserItems">
3232
{{item.name}}
3333
<template v-slot:number>{{item.value}}</template>
3434
<template v-slot:description>
3535
<span class="text-medium">{{item.percentText}}</span>
3636
</template>
3737
</cly-metric-card>
38+
<div v-if="browserItems.length < 4" class="technology-analytics-wrapper-browser__empty-card">
39+
<div class="text-medium">{{i18n('common.table.no-data')}}</div>
40+
</div>
3841
</cly-metric-cards>
3942
</vue-scroll>
4043
</div>
41-
<h5> {{i18n('browser.version-distribution')}} </h5>
44+
<h5 class="bu-pb-4"> {{i18n('browser.version-distribution')}} </h5>
4245
<div class="technology-analytics-wrapper-browser__browser-versions-wrapper">
4346
<vue-scroll :ops="scrollCards" ref="bottomSlider" @handle-scroll="handleBottomScroll">
4447
<div class="bu-columns bu-is-gapless">
@@ -60,6 +63,9 @@ <h5> {{i18n('browser.version-distribution')}} </h5>
6063
</vue-scroll>
6164
</div>
6265
</div>
66+
<div v-if="browserVersions.length < 4" class="technology-analytics-wrapper-browser__versions-empty-card">
67+
<div class="text-medium">{{i18n('common.table.no-data')}}</div>
68+
</div>
6369
</div>
6470
</vue-scroll>
6571
</div>

‎plugins/browser/frontend/public/templates/browser_table.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<cly-section>
2-
<cly-datatable-n :rows="appBrowserRows" :resizable="true" v-loading="isLoading">
2+
<cly-datatable-n :rows="appBrowserRows" :resizable="true">
33
<template v-slot="scope">
44
<el-table-column sortable="custom" prop="browser" :label="i18n('browser.table.browser')"></el-table-column>
55
<el-table-column sortable="custom" prop="t" :label="i18n('common.table.total-sessions')"></el-table-column>

‎plugins/browser/frontend/public/templates/version_table.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<cly-section>
2-
<cly-datatable-n :rows="versionDetail" :resizable="true" v-loading="isLoading">
2+
<cly-datatable-n :rows="versionDetail" :resizable="true">
33
<template v-slot="scope">
44
<el-table-column sortable="custom" prop="browser_version" :label="i18n('platforms.table.platform-version')"></el-table-column>
55
<el-table-column sortable="custom" prop="t" :label="i18n('common.table.total-sessions')"></el-table-column>

‎plugins/density/frontend/public/stylesheets/density.scss

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,9 @@
5151
}
5252

5353
&__density-versions-wrapper {
54+
height: 309px;
55+
padding-bottom: 20px;
56+
5457
.__view {
5558
width:auto !important;
5659
display: flex;
@@ -88,4 +91,60 @@
8891
margin-bottom: 2px;
8992
}
9093
}
94+
95+
&__empty-card {
96+
min-height: 107px;
97+
border-left: 1px solid #ececec;
98+
width: 100%;
99+
position: relative;
100+
background-color: #ffffff;
101+
top: 50%;
102+
text-align: center;
103+
104+
div {
105+
position: absolute;
106+
top: 50%;
107+
text-align: center;
108+
width: 100%;
109+
}
110+
}
111+
112+
&__versions-empty-card {
113+
min-height: 250px;
114+
border-left: 1px solid #ececec;
115+
width: 100%;
116+
position: relative;
117+
background-color: #ffffff;
118+
border-top: 1px solid #ececec;
119+
border-right: 1px solid #ececec;
120+
121+
div {
122+
position: absolute;
123+
top: 50%;
124+
text-align: center;
125+
width: 100%;
126+
}
127+
}
128+
129+
&__metric-cards-wrapper {
130+
height: 115px;
131+
min-height: 107px;
132+
width: 100%;
133+
position:relative;
134+
135+
.__view {
136+
width: auto !important;
137+
}
138+
.cly-vue-metric-card {
139+
background-color: #fff;
140+
border-top: 1px solid #ececec;
141+
border-bottom: 1px solid #ececec;
142+
}
143+
.cly-vue-metric-cards {
144+
flex-wrap: nowrap;
145+
}
146+
.cly-vue-metric-card__wrapper {
147+
margin-right: -1.5rem;
148+
}
149+
}
91150
}

‎plugins/density/frontend/public/templates/density.html

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,29 +16,32 @@ <h2> {{i18n('density.title')}}
1616
</template>
1717
</cly-header>
1818
<cly-main>
19-
<cly-date-picker-g class="technology-density-wrapper__date-picker"></cly-date-picker-g>
20-
<div class="bu-columns bu-is-gapless">
19+
<cly-date-picker-g class="bu-mb-5"></cly-date-picker-g>
20+
<div class="bu-columns bu-is-gapless bu-mt-2">
2121
<h4>{{i18n('density.densities-for')}}</h4>
2222
<div class ="selector_wrapper">
23-
<el-select v-model="selectedProperty">
23+
<el-select v-model="selectedProperty" :arrow="false" :adaptiveLength="true">
2424
<el-option :key="item.value" :value="item.value" :label="item.name" v-for="item in chooseProperties"></el-option>
2525
</el-select>
2626
</div>
2727
</div>
28-
<div class="bg-white bu-mb-4 technology-density-wrapper__metric-cards-wrapper">
28+
<div class="bu-pb-4 technology-density-wrapper__metric-cards-wrapper">
2929
<vue-scroll :ops="scrollCards" ref="topSlider" @handle-scroll="handleCardsScroll">
30-
<cly-metric-cards class="bu-is-flex-wrap-nowrap">
31-
<cly-metric-card class="bu-mr-2" v-bind:style="[densityItems.length > 4 ? {'width': 'fit-content'} : {}]" :is-percentage="true" :columnWidth=3 :color="item.color" :number="item.percent" :key="idx" v-for="(item, idx) in densityItems">
30+
<cly-metric-cards>
31+
<cly-metric-card :is-percentage="true" :columnWidth=3 :color="item.color" :number="item.percent" :key="idx" v-for="(item, idx) in densityItems">
3232
{{item.name}}
3333
<template v-slot:number>{{item.value}}</template>
3434
<template v-slot:description>
3535
<span class="text-medium">{{item.percentText}}</span>
3636
</template>
3737
</cly-metric-card>
38+
<div v-if="densityItems.length < 4" class="technology-density-wrapper__empty-card">
39+
<div class="text-medium">{{i18n('common.table.no-data')}}</div>
40+
</div>
3841
</cly-metric-cards>
3942
</vue-scroll>
4043
</div>
41-
<h5> {{i18n('density.distribution')}} </h5>
44+
<h5 class="bu-pb-4"> {{i18n('density.distribution')}} </h5>
4245
<div class="technology-density-wrapper__density-versions-wrapper">
4346
<vue-scroll :ops="scrollCards" ref="bottomSlider" @handle-scroll="handleBottomScroll">
4447
<div class="bu-columns bu-is-gapless">
@@ -60,6 +63,9 @@ <h5> {{i18n('density.distribution')}} </h5>
6063
</vue-scroll>
6164
</div>
6265
</div>
66+
<div v-if="densityVersions.length < 4" class="technology-density-wrapper__versions-empty-card">
67+
<div class="text-medium">{{i18n('common.table.no-data')}}</div>
68+
</div>
6369
</div>
6470
</vue-scroll>
6571
</div>

‎plugins/errorlogs/frontend/public/stylesheets/main.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.routename-errorlogs {
2+
&__dropdown-frame {
3+
border-bottom: 1px solid #ececec;
4+
}
5+
}

‎plugins/errorlogs/frontend/public/templates/logs.html

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,27 @@ <h2> {{i18n('errorlogs.title')}} </h2>
55
</template>
66
</cly-header>
77
<cly-main>
8-
<el-select v-model="selectLog" v-on:change="changeLog" class="bu-mb-4">
9-
<el-option :key="item.value" :value="item.value" :label="item.name" v-for="item in logList"></el-option>
10-
</el-select>
11-
<el-button v-on:click="clear" type="danger" class="bu-is-pulled-right bu-ml-4">{{i18n('errorlogs.clear')}}</el-button>
12-
<a :href="downloadLink" target="_blank">
13-
<el-button class="bu-is-pulled-right bu-ml-4">{{i18n('errorlogs.download')}}</el-button>
14-
</a>
15-
<cly-section class="bu-mt-4">
8+
<cly-section>
9+
<div class="routename-errorlogs__dropdown-frame">
10+
<el-select v-model="selectLog" v-on:change="changeLog" class="bu-m-3">
11+
<el-option :key="item.value" :value="item.value" :label="item.name" v-for="item in logList">
12+
</el-option>
13+
</el-select>
14+
</div>
15+
<div class="bu-p-5">
16+
<el-link v-on:click="clear" class="bu-is-underlined bu-is-pulled-right bu-ml-4">
17+
{{i18n('errorlogs.clear')}}
18+
</el-link>
19+
<a :href="downloadLink" target="_blank">
20+
<el-link class="bu-is-underlined bu-is-pulled-right">{{i18n('errorlogs.download')}}</el-link>
21+
</a>
22+
</div>
1623
<div class="errorlogs">
1724
<div class="pre-block">
1825
<pre>{{cachedLog.data}}</pre>
1926
</div>
2027
</div>
21-
</cly-section>
28+
29+
</cly-section>
2230
</cly-main>
2331
</div>

0 commit comments

Comments
 (0)