1

src/view/echarts_sy/pie.vue

@@ -89,19 +89,20 @@ let option = {
   legend: [
     {
       orient: "vertical",
-      right: "10%",
+      right: "6%",
       top: "10%",
       itemWidth: 25, // 可以设置图例标记的宽度
       itemHeight: 10, // 设置图例标记的高度，这里是椭圆的长轴
-      itemGap: 20,
+      itemGap: 19,
       itemStyle: {
         borderColor: "rgba(255,255,255,0.2)", // 图例边框颜色
-        borderWidth: 8, // 图例边框宽度
+        borderWidth: 10, // 图例边框宽度
         borderRadius:20,
       },
       textStyle: {
         color: "#ccc",
         fontSize: 12,
+        padding:10,
         rich: {
           name: {
             width: 80,
@@ -135,7 +136,7 @@ let option = {
       type: "pie",
       roseType: "radius",
       radius: ["20%", "85%"],
-      center: ["25%", "53%"],
+      center: ["25%", "50%"],
       label: {
         position: "inside",
         formatter(item) {
@@ -177,7 +178,7 @@ let option = {
       type: "pie",
       roseType: "radius",
       radius: ["20%", "87%"],
-      center: ["25%", "53%"],
+      center: ["25%", "50%"],
       label: {
         show: false,
       },

src/view/echarts_sy/pie2.vue

@@ -25,6 +25,7 @@ const option = {
     itemWidth: 30,
     textStyle: {
       fontSize: 16,
+      padding:10,
       color: "#fff",
     },
     top: 70,

src/view/sy.vue

@@ -174,8 +174,8 @@
             <div class="sex">女性人口</div>
           </div>
         </div>
-        <ePie2 style="margin-top: 20px;"></ePie2>
-        <ePie style="margin-bottom:30px;"></ePie>
+        <ePie2 style="margin-top: 20px"></ePie2>
+        <ePie style="margin-bottom: 30px"></ePie>
         <div class="table">
           <div class="table_choose">
             <div
@@ -249,7 +249,9 @@
         <div class="yd_title last"></div>
         <div class="tysy">
           <div class="tysy_item" v-for="(item, index) in tysyList" :key="index">
-            <div class="value">{{ item.value }}</div>
+            <div class="value">
+              {{ item.value }}<span>{{ item.dw ? item.dw : "" }}</span>
+            </div>
             <img :src="item.img" />
             <div class="name">{{ item.name }}</div>
           </div>
@@ -316,6 +318,26 @@ const tableData = ref([
     address: "龙游县五一单位",
     finish: false,
   },
+  {
+    company: "龙游县文旅集团",
+    address: "龙游县五一单位",
+    finish: false,
+  },
+  {
+    company: "龙游县文旅集团",
+    address: "龙游县五一单位",
+    finish: false,
+  },
+  {
+    company: "龙游县文旅集团",
+    address: "龙游县五一单位",
+    finish: false,
+  },
+  {
+    company: "龙游县文旅集团",
+    address: "龙游县五一单位",
+    finish: false,
+  },
 ]);
 const rowState = (row) => {
   if (row.rowIndex % 2 == 0) {
@@ -338,7 +360,7 @@ const rowState = (row) => {
 };
 const tableHeaderColor = (arg) => {
   return {
-    paddingLeft:'10px',
+    paddingLeft: "10px",
     letterSpacing: "1px",
     fontSize: "15px",
     height: "50px",
@@ -346,14 +368,18 @@ const tableHeaderColor = (arg) => {
     color: "#fff",
   };
 };
-const cs =computed(()=>{
-  let str=`--teacher: ${jysyList.value[0].teacher}; --total: ${jysyList.value[0].teacher+jysyList.value[0].student}`;
-  return str
-})
-const nc =computed(()=>{
-   let str=`--teacher: ${jysyList.value[1].teacher}; --total: ${jysyList.value[1].teacher+jysyList.value[1].student}`;
-  return str
-})
+const cs = computed(() => {
+  let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${
+    jysyList.value[0].teacher + jysyList.value[0].student
+  }`;
+  return str;
+});
+const nc = computed(() => {
+  let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${
+    jysyList.value[1].teacher + jysyList.value[1].student
+  }`;
+  return str;
+});
 const jysyList = ref([
   {
     title: "城市",
@@ -448,7 +474,8 @@ const tysyList = ref([
   },
   {
     name: "绿色跑道",
-    value: "100km",
+    value: "100",
+    dw:'km',
     img: running,
   },
 ]);
@@ -1154,10 +1181,10 @@ const jtsyList = ref([
 }
 :deep(.el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf) {
   border: none !important;
-  padding-left: 10px !important; 
+  padding-left: 10px !important;
 }
 
-:deep(.el-table td.el-table__cell){
+:deep(.el-table td.el-table__cell) {
   padding-left: 10px;
 }
 ::v-deep .el-table--enable-row-hover .el-table__body tr:hover > td {
@@ -1168,7 +1195,7 @@ const jtsyList = ref([
   background-color: #122560;
 }
 
-:deep(.el-table .el-table__row){
+:deep(.el-table .el-table__row) {
   border-bottom: none;
 }
 //右边