src/views/OperationalOverview/components/ISRAChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-01-29 13:45:56
- * @LastEditTime: 2024-04-11 11:02:53
+ * @LastEditTime: 2024-04-15 09:28:21
  * @LastEditors: zhp
  * @Description:
 -->
@@ -13,6 +13,7 @@
 </template>
 
 <script>
+import { position } from '@antv/x6-common/lib/dom/position';
 import * as echarts from 'echarts';
 // import resize from './../mixins/resize'
 // import NotMsg from './../components/NotMsg'
@@ -49,22 +50,22 @@ export default {
   mounted() {
     this.chartData = [
       {
-        name: '细长泡',
+        name: '0904褶皱/严重',
         num: 1112,
         yield: 0.97,
       },
       {
-        name: '长泡',
+        name: '0904褶皱/严重',
         num: 1112,
         yield: 0.97,
       },
        {
-         name: '开口泡',
+         name: '0904褶皱/严重',
         num: 1112,
         yield: 0.97,
       },
        {
-         name: '结石',
+         name: '0904褶皱/严重',
         num: 1112,
         yield: 0.97,
       }
@@ -72,6 +73,22 @@ export default {
     this.updateChart()
   },
   methods: {
+    getEqualNewlineString(params, length) {
+      let text = ''
+      let count = Math.ceil(params.length / length) // 向上取整数
+      // 一行展示length个
+      if (count > 1) {
+        for (let z = 1; z <= count; z++) {
+          text += params.substr((z - 1) * length, length)
+          if (z < count) {
+            text += '\n'
+          }
+        }
+      } else {
+        text += params.substr(0, length)
+      }
+      return text
+    },
 		updateChart() {
 			console.log('update')
 			let num = 0
@@ -128,26 +145,37 @@ export default {
 				series:[{
 						name: 'ISRA缺陷检测',
             type: 'pie',
+            // position:outerHeight,
 						center: ['50%', '40%'],
 						radius: ['45%', '70%'],
 						avoidLabelOverlap: true,
           label: {
             show: true,
             normal: {
+              alignTo: 'labelLine',
+              margin: 10,
+              edgeDistance: 10,
+              lineHeight: 16,
               // 各分区的提示内容
               // params: 即下面传入的data数组,通过自定义函数，展示你想要的内容和格式
               formatter: function (params) {
                 console.log(params);
-                return params.value + " | " + params.percent.toFixed(0) + "%" + "\n\n" + params.name;
+                return ;
+              },
+              formatter: (params) => {
+                //调用自定义显示格式
+                return this.getEqualNewlineString(params.value + " | " + params.percent.toFixed(0) + "%" + "\n" + params.name,10);
               },
               textStyle: {            // 提示文字的样式
                 // color: '#595959',
-                fontSize: 24.48
+                fontSize: 16
               }
             }
 						},
 						labelLine: {
               show: true,
+              length: 25,
+              length2: 10,
 						},
 						data: this.chartData && this.chartData.length > 0 && this.chartData.map((item, index) => ({
 						name:item.name,

src/views/quality/base/basicData/qualityInspectionBoxPermissions/index.vue

@@ -103,7 +103,6 @@ export default {
 					: undefined,
       ].filter((v) => v),
       tableData: [],
-
 			tableProps: [
 				// {
 				// 	prop: 'createTime',