feat:update

src/components/base/WordCloundChart/wordCloudChart.js

 import 'echarts-wordcloud';
+import { MUTICHARTCOLORS } from '@/common/constant';
 
 const getWordCloudChart = (data) => {
       const option = {
@@ -17,7 +18,7 @@ const getWordCloudChart = (data) => {
           // 其他形状你可以使用形状路径
           // shape: 'circle', // 示例
           // 或者自定义路径
-          gridSize: 35, // 网格大小，影响词间距。
+          gridSize: 15, // 网格大小，影响词间距。
           sizeRange: [16, 36], // 定义词云中文字大小的范围
           rotationRange: [0, 0],
           rotationStep: 0,
@@ -35,15 +36,16 @@ const getWordCloudChart = (data) => {
             //   }
             // },
             color: function () {
-              let colors = [
-                "rgba(189, 33, 33, 1)",
-                "rgba(232, 151, 21, 1)",
-                "rgba(220, 190, 68, 1)",
-                "rgba(96, 58, 186, 1)",
-                "rgba(32, 121, 69, 1)",
-                "rgba(22, 119, 255, 1)",
-              ];
-              return colors[parseInt(Math.random() * colors.length)];
+              // let colors = [
+              //   "rgba(189, 33, 33, 1)",
+              //   "rgba(232, 151, 21, 1)",
+              //   "rgba(220, 190, 68, 1)",
+              //   "rgba(96, 58, 186, 1)",
+              //   "rgba(32, 121, 69, 1)",
+              //   "rgba(22, 119, 255, 1)",
+              // ];
+              // let colors = MUTICHARTCOLORS
+              return MUTICHARTCOLORS[parseInt(Math.random() * MUTICHARTCOLORS.length)];
             },
             emphasis: {
               shadowBlur: 5,

src/styles/components/WarnningPane/index.vue

@@ -2,7 +2,7 @@
 import { ElRow, ElCol } from 'element-plus';
 import '@/styles/common.scss'
 import WarnningPane from '@/components/base/WarningPane/index.vue'
-const span = 12
+const span = 24
 </script>
 
 <template>
@@ -12,19 +12,26 @@ const span = 12
 {{
   `import WarnningPane from '@/components/base/WarningPane/index.vue';
 <template>
-    <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字我是特别重大风险内容文字">
-    </WarnningPane>
+    <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字我是特别重大风险内容文字" />
 </template>
 `}}
 </pre>
-      <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字">
-      </WarnningPane>
+      <div class="warnning-box">
+      <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字我是特别重大风险内容文字" />
+      <WarnningPane warnningLevel="重大风险" warnningContent="我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容我是重大风险内容" />
+      <WarnningPane warnningLevel="较大风险" warnningContent="我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容我是较大风险内容" />
+      <WarnningPane warnningLevel="一般风险" warnningContent="我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容我是一般风险内容" />
+      <WarnningPane warnningLevel="低风险" warnningContent="我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容我是低风险内容" />
+      </div>
+     
     </el-col>
   </el-row>
 </template>
 
 <style lang="scss" scoped>
-.person-avatar {
-  width: 200px;
+.warnning-box{
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
 </style>
\ No newline at end of file

src/styles/components/WordCloudChart/index.vue

@@ -35,6 +35,11 @@ const data = ref([
   { name: "选举压力", value: 57 },
   { name: "主张财政紧缩", value: 72 },
   { name: "财政保守", value: 18 },
+  { name: "财政保守1", value: 25 },
+  { name: "财政保守2", value: 46 },
+  { name: "财政保守3", value: 72 },
+  { name: "财政保守4", value: 69 },
+  { name: "财政保守5", value: 53 },
 ])
 </script>