专业库--详情-饼图

src/views/career/plan/new-profess-detail.vue

@@ -67,19 +67,25 @@
           <el-col :span="8">
             <div class="desc-item" >
               <p class="format-tit">主要职业分布</p>
-              <div class="f-666 f14" ></div>
+              <div class="f-666 f14" >
+                <mx-chart :options="industry" height="200px"></mx-chart>
+              </div>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="desc-item" >
               <p class="format-tit">主要行业分布</p>
-              <div class="f-666 f14"></div>
+              <div class="f-666 f14">
+                <mx-chart :options="industry" height="200px"></mx-chart>
+              </div>
             </div>
           </el-col>
           <el-col :span="8">
             <div class="desc-item" >
               <p class="format-tit">主要就业地区分布</p>
-              <div class="f-666 f14"></div>
+              <div class="f-666 f14">
+                <mx-chart :options="jobAddress" height="200px"></mx-chart>
+              </div>
             </div>
           </el-col>
         </el-row>
@@ -115,7 +121,59 @@ export default {
     reverseSalary() {
       if (!this.prospects.averageSalary) return null
       const averageSalary = this.deepClone(this.prospects.averageSalary)
-      return averageSalary.reverse()
+      return averageSalary.reverse().splice(0 ,10)
+    },
+    // 主要职业分布
+
+    // 主要行业分布
+    industry() {
+      if (!this.prospects.industryDistribution) return null
+      const pieData = this.prospects.industryDistribution
+      const options  = {
+        toolbox: {
+          show: true,
+        },
+        series: [
+          {
+            type: 'pie',
+            radius: [40, 60],
+            label:{
+              formatter: '{b}'
+            },
+            labelLine: {
+              length2: 6,
+              length: 5
+            },
+            data: pieData
+          }
+        ]
+      }
+      return options
+    },
+    // 主要就业地区分布
+    jobAddress() {
+      if(!this.prospects.jobRegionDistribution.length) return
+      const pieData = this.prospects.jobRegionDistribution
+      const options  = {
+        toolbox: {
+          show: true,
+        },
+        series: [
+          {
+            type: 'pie',
+            radius: [40, 60],
+            label:{
+              formatter: '{b}'
+            },
+            labelLine: {
+              length2: 6,
+              length: 5
+            },
+            data: pieData
+          }
+        ]
+      }
+      return options
     },
     chartSalary() {
       if (!this.prospects.averageSalary) return null