优化

commandCenter/src/views/communityAssets/assembly/indexOptionChart.js

@@ -133,6 +133,82 @@ export const ringType = (color = [], data = [], title = {}, legendFcuntion = {})
         ]
     };
 };
+export const ringTypes = (color = [], data = [], title = {}, legendFcuntion = {}) => {
+    let legendFcuntionValue = (v) => {
+        let val = '';
+        data.map((item) => {
+            if (item.name == v) {
+                if (legendFcuntion.type == '%') {
+                    val = `{a|${v}} · · · · · · {b|${parseInt((item.value / legendFcuntion.total).toFixed(2) * 100) || 0}%}`;
+                } else {
+                    if (v.length > 5 || v.length == 5) {
+                        let va = v.substr(0, 3) + '…';
+                        val = `{a|${va}} · · · · {b|${item.value}}`;
+                    } else if (item.value.length == 4 || item.value.length > 4) {
+                        let itval = item.value.substr(0, 4) + '…';
+                        val = `{a|${v}} · · · · {b|${itval}}`;
+                    } else if ((v.length > 5 || v.length == 5) && (item.value.length == 4 || item.value.length > 4)) {
+                        let va = v.substr(0, 3) + '…';
+                        let itval = item.value.substr(0, 4) + '…';
+                        val = `{a|${va}} · · · · {b|${itval}}`;
+                    } else {
+                        val = `{a|${v}} · · · · {b|${item.value}}`;
+                    }
+                }
+            }
+        });
+        return val;
+    };
+    return {
+        tooltip: {
+            trigger: 'item'
+        },
+        legend: {
+            orient: 'vertical',
+            right: 0,
+            top: 80,
+            itemGap: 10,
+            itemWidth: 12, // 图例图形宽度
+            itemHeight: 8,
+            type: 'scroll',
+            formatter: (v) => {
+                return legendFcuntionValue(v);
+            },
+            textStyle: {
+                rich: {
+                    a: {
+                        fontSize: 12,
+                        color: '#858892',
+                        padding: [0, 5, 0, 0]
+                    },
+                    b: {
+                        fontSize: 14,
+                        color: '#fff',
+                        padding: [0, 0, 0, 5]
+                    }
+                }
+            }
+        },
+        title,
+        color: !!color.length ? color : defaultColor,
+        series: [
+            {
+                type: 'pie',
+                radius: ['57%', '71%'],
+                avoidLabelOverlap: false,
+                center: ['25%', '50%'],
+                label: {
+                    show: false,
+                    position: 'center'
+                },
+                labelLine: {
+                    show: false
+                },
+                data: data
+            }
+        ]
+    };
+};
 
 // 饼图  2560
 export const ringTypeEnlarge = (color = [], data = [], title = {}, legendFcuntion = {}) => {

commandCenter/src/views/communityAssets/assembly/rentalAndSaleRate.vue

@@ -19,7 +19,7 @@
   </div>
 </template>
 <script>
-import { ringType, ringTypeEnlarges } from './indexOptionChart';
+import { ringTypes, ringTypeEnlarges } from './indexOptionChart';
 import index from './allcommunit'
 let defaultTitle = {
   text: `{a|租售率}`,
@@ -105,7 +105,7 @@ export default {
           }
         }
       },
-      clientOptions: ringType(
+      clientOptions: ringTypes(
         [],
         [
           { name: '待租售', value: 0 },
@@ -121,7 +121,7 @@ export default {
       this.$http.get('/sc-community/statisticsaleRate', this.mixins_query).then(({ data, msg, status }) => {
         if (status == 0) {
           if (window.screen.width == 1920 || window.screen.width < 1920) {
-            this.clientOptions = ringType([], this.eachartObj(data), {
+            this.clientOptions = ringTypes([], this.eachartObj(data), {
               subtext: `{b|${parseInt(((data.datas[1] + data.datas[2]) / data.total).toFixed(2) * 100) || 0 * 100}%}`,
               ...defaultTitle
             });
@@ -154,7 +154,7 @@ export default {
   created () {
     if (window.screen.width == 1920 || window.screen.width < 1920) {
       this.valueClass = 1;
-      this.clientOptions = ringType([],
+      this.clientOptions = ringTypes([],
         [
           { name: '待租售', value: 0 },
           { name: '已售', value: 0 },

commandCenter/src/views/financialAnalysis/smallModuleIndex/indexOptionChart.js

@@ -1481,7 +1481,7 @@ export const quantitativeAnalysisDashboard = (name = [], data = [], color = [])
         // backgroundColor: 'rgba(8, 17, 67, 0.9)',
         title: {
             text: name,
-            left: '33%',
+            left: '36%',
             top: '30%',
             textAlign: 'center',
             textStyle: {
@@ -1496,8 +1496,8 @@ export const quantitativeAnalysisDashboard = (name = [], data = [], color = [])
             }
         },
         polar: {
-            radius: ['72%', '97%'],
-            center: ['35%', '50%']
+            radius: ['71%', '96%'],
+            center: ['38%', '50%']
         },
         // 极坐标角度轴
         angleAxis: {

commandCenter/src/views/operationalServices/assembly/completionMaintenanceOrder.vue

@@ -28,7 +28,7 @@
   </div>
 </template>
 <script>
-import { GradualChange, ringType, ringTypeEnlarges } from './indexOptionChart';
+import { GradualChange, ringTypes, ringTypeEnlarges } from './indexOptionChart';
 import index from './allcommunit'
 // import permissionComponent from '../permissionComponent';
 const colors = [
@@ -54,7 +54,7 @@ export default {
       },
       date: '',
       total: 0,
-      clientOptions: ringType(
+      clientOptions: ringTypes(
         colors,
         [
           { value: 0, name: '待派单' },
@@ -74,7 +74,7 @@ export default {
         if (status == 0 && !!data.datas) {
           // this.clientOptions = ringType(colors, this.eachartObj(data), {}, { type: 'number', total: data.total });
           if (window.screen.width == 1920 || window.screen.width < 1920) {
-            this.clientOptions = ringType(colors, this.eachartObj(data), {}, { type: 'number', total: data.total });
+            this.clientOptions = ringTypes(colors, this.eachartObj(data), {}, { type: 'number', total: data.total });
           } else if (window.screen.width == 2560 || window.screen.width > 1920) {
             this.clientOptions = ringTypeEnlarges(colors, this.eachartObj(data), {}, { type: 'number', total: data.total });
           }
@@ -101,7 +101,7 @@ export default {
   created () {
     if (window.screen.width == 1920 || window.screen.width < 1920) {
       this.valueClass = 1;
-      this.clientOptions = ringType(
+      this.clientOptions = ringTypes(
         colors,
         [
           { value: 0, name: '待派单' },

commandCenter/src/views/operationalServices/assembly/indexOptionChart.js

@@ -133,6 +133,82 @@ export const ringType = (color = [], data = [], title = {}, legendFcuntion = {})
         ]
     };
 };
+export const ringTypes = (color = [], data = [], title = {}, legendFcuntion = {}) => {
+    let legendFcuntionValue = (v) => {
+        let val = '';
+        data.map((item) => {
+            if (item.name == v) {
+                if (legendFcuntion.type == '%') {
+                    val = `{a|${v}} · · · · · · {b|${parseInt((item.value / legendFcuntion.total).toFixed(2) * 100) || 0}%}`;
+                } else {
+                    if (v.length > 5 || v.length == 5) {
+                        let va = v.substr(0, 3) + '…';
+                        val = `{a|${va}} · · · · {b|${item.value}}`;
+                    } else if (item.value.length == 4 || item.value.length > 4) {
+                        let itval = item.value.substr(0, 4) + '…';
+                        val = `{a|${v}} · · · · {b|${itval}}`;
+                    } else if ((v.length > 5 || v.length == 5) && (item.value.length == 4 || item.value.length > 4)) {
+                        let va = v.substr(0, 3) + '…';
+                        let itval = item.value.substr(0, 4) + '…';
+                        val = `{a|${va}} · · · · {b|${itval}}`;
+                    } else {
+                        val = `{a|${v}} · · · · {b|${item.value}}`;
+                    }
+                }
+            }
+        });
+        return val;
+    };
+    return {
+        tooltip: {
+            trigger: 'item'
+        },
+        legend: {
+            orient: 'vertical',
+            right: 0,
+            top: 80,
+            itemGap: 10,
+            itemWidth: 12, // 图例图形宽度
+            itemHeight: 8,
+            type: 'scroll',
+            formatter: (v) => {
+                return legendFcuntionValue(v);
+            },
+            textStyle: {
+                rich: {
+                    a: {
+                        fontSize: 12,
+                        color: '#858892',
+                        padding: [0, 5, 0, 0]
+                    },
+                    b: {
+                        fontSize: 14,
+                        color: '#fff',
+                        padding: [0, 0, 0, 5]
+                    }
+                }
+            }
+        },
+        title,
+        color: !!color.length ? color : defaultColor,
+        series: [
+            {
+                type: 'pie',
+                radius: ['50%', '62%'],
+                avoidLabelOverlap: false,
+                center: ['25%', '50%'],
+                label: {
+                    show: false,
+                    position: 'center'
+                },
+                labelLine: {
+                    show: false
+                },
+                data: data
+            }
+        ]
+    };
+};
 
 // 饼图  2560
 export const ringTypeEnlarge = (color = [], data = [], title = {}, legendFcuntion = {}) => {