| | |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div class="w-full h-full bg-[#f2f4f8]" id="overview"> |
|---|
| | | <!-- <div class="w-full h-[40px] flex items-center">年度缴费情况</div> |
|---|
| | | <div class="h-full"> |
|---|
| | | <div class="w-[310px] flex flex-wrap justify-between h-[220px]"> |
|---|
| | | <div v-for="item in state.annualPayment" :key="item" class="w-[50%] h-[33%] flex items-center"> |
|---|
| | | <div :class="['iconfont icon-' + item.Icon]" :style="`color:${item.BgColor};font-size:${36}px`"></div> |
|---|
| | | <div class="ml-[10px]"> |
|---|
| | | <span>{{ item.Value }} <span>{{ item.Unit }}</span></span> |
|---|
| | | <p>{{ item.Name }}</p> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="screen-top-center"> |
|---|
| | | <div class="top-center-data"> |
|---|
| | | <div class="data-item" v-for="(item, index) in state.dataList"> |
|---|
| | |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | orient: 'vertical', |
|---|
| | | left: 'right', |
|---|
| | | left: '60%', |
|---|
| | | y: 'center', |
|---|
| | | |
|---|
| | | formatter: function (name) { |
|---|
| | | let target, percentage; |
|---|
| | | for (let i = 0; i < dataCake.length; i++) { |
|---|
| | |
|---|
| | | let arr = [name + ' ', ' ' + target + '人 ', ' ' + percentage]; |
|---|
| | | return arr.join(' '); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '45' |
|---|
| | | }, |
|---|
| | | // title: { |
|---|
| | | // text: '76%',//主标题文本 |
|---|
| | |
|---|
| | | name: '今日业绩完成度', |
|---|
| | | type: 'pie', |
|---|
| | | radius: ['40%', '70%'], |
|---|
| | | center: ['30%', '50%'], |
|---|
| | | avoidLabelOverlap: false, |
|---|
| | | label: { |
|---|
| | | show: false, |
|---|
