Commit 832d71d0 authored by leon's avatar leon

feat: progress component bug

parent b4662e18
......@@ -3,26 +3,27 @@
<u-line-progress
class="u-line"
v-if="elementInfo.option.progress.type === 'line'"
:style="{'width': elementInfo.width + 'rpx'}"
:style="{'width': elementInfo.width + 'px', 'font-size': elementInfo.option.progress.fontSize +'px', 'color': elementInfo.option.progress.titleColor}"
:height="elementInfo.option.progress.height"
:active-color="elementInfo.option.progress.strokeColor"
:inactive-color="elementInfo.option.progress.trailColor"
:round="elementInfo.option.progress.strokeLinecap == 'round' ? true : false"
:percent="elementInfo.data.dataList.endVal"
:percent="endVal"
:show-percent="elementInfo.option.progress.showInfo"
>
</u-line-progress>
<u-circle-progress
class="u-circle"
v-if="elementInfo.option.progress.type === 'circle'"
:width="elementInfo.option.progress.width"
:border-width="elementInfo.option.progress.strokeWidth"
:width="getRpx(elementInfo.option.progress.width)"
:border-width="getRpx(elementInfo.option.progress.strokeWidth)"
:active-color="elementInfo.option.progress.strokeColor"
:inactive-color="elementInfo.option.progress.trailColor"
:percent="elementInfo.data.dataList.endVal"
:percent="endVal"
:bg-color="00000000"
>
<view class="u-progress-text">{{elementInfo.data.dataList.endVal}}%</view>
<view class="u-progress-text"
:style="{'font-size': elementInfo.option.progress.fontSize +'px', 'color': elementInfo.option.progress.titleColor}">{{endVal}}%</view>
</u-circle-progress>
<DashboardProgress style="height: 100%;" v-if="elementInfo.option.progress.type === 'dashboard'" :elementInfo="elementInfo"></DashboardProgress>
</view>
......@@ -34,13 +35,26 @@ import echartElementData from '@/mixins/echartElementData.js'
export default {
name:"NormalProgress",
mixins: [echartElementData],
data() {
return {
endVal: 30,
};
},
methods: {
initChart() {}
initChart() {
const that = this
that.$nextTick(() => {
that.endVal = that.elementData.dataList.endVal
})
},
getRpx(value) {
return this.$u.common.pxToRpx(value)
}
}
}
</script>
<style>
<style lang="scss">
.container {
width: 100%;
height: 100%;
......@@ -54,9 +68,4 @@ export default {
.u-circle {
align-self: center;
}
.u-progress-text {
font-size: 40rpx;
font-weight: bold;
color: white;
}
</style>
\ No newline at end of file
......@@ -121,8 +121,8 @@
@include vue-flex;
justify-items: flex-end;
justify-content: space-around;
font-size: 20rpx;
color: #ffffff;
// font-size: 20rpx;
// color: #ffffff;
transition: all 0.4s ease;
}
......
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