工单&物料

Reviewed-on: #9

src/App.vue

@@ -8,12 +8,23 @@
 export default {
   name: 'App',
   mounted() {
+    this.beilv = document.body.offsetWidth / 1920
+    document.documentElement.style.setProperty('--beilv', this.beilv)
+    window.addEventListener('resize', () => {
+      this.beilv = document.body.offsetWidth / 1920
+      document.documentElement.style.setProperty('--beilv', this.beilv)
+    })
+  },
+  data() {
+    return {
+      beilv: 1
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-  #app {
-    background-color: #f2f4f9;
-  }
+#app {
+  background-color: #f2f4f9;
+}
 </style>

src/components/Breadcrumb/index.vue

@@ -9,8 +9,10 @@
 <template>
   <el-breadcrumb class="app-breadcrumb" separator="/">
     <transition-group name="breadcrumb">
-      <el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
-        <span v-if="item.redirect==='noRedirect'||index==levelList.length-1" class="isredirect">{{ item.meta.title }}</span>
+      <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
+        <span v-if="item.redirect === 'noRedirect' || index == levelList.length - 1" class="isredirect">
+          {{ item.meta.title }}
+        </span>
         <span v-else class="no-redirect">{{ item.meta.title }}</span>
         <!-- @click.prevent="handleLink(item)" -->
       </el-breadcrumb-item>
@@ -79,14 +81,14 @@ export default {
 <style lang="scss" scoped>
 .app-breadcrumb.el-breadcrumb {
   display: inline-block;
-  font-size: 14px;
-  line-height: 48px;
-  margin-left: 8px;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(48px * var(--beilv));
+  margin-left: calc(8px * var(--beilv));
   .isredirect {
     color: rgba(0, 0, 0, 0.65);
   }
   .no-redirect {
-    color: #8C8C8C;
+    color: #8c8c8c;
     cursor: text;
   }
 }

src/components/Hamburger/index.vue

@@ -1,6 +1,14 @@
 <template>
-  <div style="padding: 5px 15px 5px 32px;" @click="toggleClick">
-    <svg-icon style="width: 24px; height: 24px" class="item-icon hamburger" :class="{'is-active':isActive}" icon-class="hamburgerBtn" />
+  <div
+    style="padding: 0  calc(15px * var(--beilv)) 0 calc(32px * var(--beilv));"
+    @click="toggleClick"
+  >
+    <svg-icon
+      style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv));"
+      class="item-icon hamburger"
+      :class="{ 'is-active': isActive }"
+      icon-class="hamburgerBtn"
+    />
   </div>
 </template>
 

src/components/LangSelect/index.vue

@@ -9,13 +9,17 @@
 <template>
   <el-dropdown trigger="click" class="international" @command="handleSetLanguage">
     <div>
-      <svg-icon style="width: 24px; height: 24px; vertical-align: -7px" class-name="international-icon" :icon-class="isShow ? 'language2' : 'language3'" />
+      <svg-icon
+        style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv));  vertical-align: calc(-7px * var(--beilv));"
+        class-name="international-icon"
+        :icon-class="isShow ? 'language2' : 'language3'"
+      />
     </div>
     <el-dropdown-menu slot="dropdown">
-      <el-dropdown-item :disabled="language==='zh'" command="zh">
+      <el-dropdown-item :disabled="language === 'zh'" command="zh">
         中文
       </el-dropdown-item>
-      <el-dropdown-item :disabled="language==='en'" command="en">
+      <el-dropdown-item :disabled="language === 'en'" command="en">
         English
       </el-dropdown-item>
       <!-- <el-dropdown-item :disabled="language==='es'" command="es">

src/icons/svg/alarm-old.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1611908177855" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6794" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M577.463954 946.834286c20.114286 0 36.425143 16.237714 36.425143 36.352v4.388571a36.352 36.352 0 0 1-36.425143 36.425143h-130.925714a36.352 36.352 0 0 1-36.425143-36.352v-4.388571c0-20.187429 16.310857-36.425143 36.425143-36.425143h130.925714zM512.001097 0c75.044571 0 135.826286 57.344 135.826286 128l0.073143 23.990857c139.117714 51.2 237.714286 178.761143 237.714285 328.045714l-0.073142 334.482286h63.488c21.211429 0 38.4 17.188571 38.4 38.4v4.681143c0 21.211429-17.188571 38.4-38.4 38.4H74.972526A38.4 38.4 0 0 1 36.572526 857.6v-4.681143c0-21.211429 17.188571-38.4 38.4-38.4h63.414857V480.036571c0-149.211429 98.596571-276.772571 237.714286-328.045714V128C376.174811 57.344 437.029669 0 512.001097 0z m0 211.602286c-151.990857 0-284.086857 120.32-284.086857 268.8l-0.073143 334.116571h571.026286V480.402286c0-148.48-134.875429-268.8-286.866286-268.8z m0-140.8c-37.522286 0-61.586286 21.869714-61.586286 57.197714h0.073143v4.754286a398.628571 398.628571 0 0 1 123.684572 0.073143l-0.073143-4.827429c0-35.328-24.576-57.197714-62.098286-57.197714z" p-id="6795"></path></svg>

src/icons/svg/alarm.svg

@@ -1 +1,14 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1611908177855" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6794" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M577.463954 946.834286c20.114286 0 36.425143 16.237714 36.425143 36.352v4.388571a36.352 36.352 0 0 1-36.425143 36.425143h-130.925714a36.352 36.352 0 0 1-36.425143-36.352v-4.388571c0-20.187429 16.310857-36.425143 36.425143-36.425143h130.925714zM512.001097 0c75.044571 0 135.826286 57.344 135.826286 128l0.073143 23.990857c139.117714 51.2 237.714286 178.761143 237.714285 328.045714l-0.073142 334.482286h63.488c21.211429 0 38.4 17.188571 38.4 38.4v4.681143c0 21.211429-17.188571 38.4-38.4 38.4H74.972526A38.4 38.4 0 0 1 36.572526 857.6v-4.681143c0-21.211429 17.188571-38.4 38.4-38.4h63.414857V480.036571c0-149.211429 98.596571-276.772571 237.714286-328.045714V128C376.174811 57.344 437.029669 0 512.001097 0z m0 211.602286c-151.990857 0-284.086857 120.32-284.086857 268.8l-0.073143 334.116571h571.026286V480.402286c0-148.48-134.875429-268.8-286.866286-268.8z m0-140.8c-37.522286 0-61.586286 21.869714-61.586286 57.197714h0.073143v4.754286a398.628571 398.628571 0 0 1 123.684572 0.073143l-0.073143-4.827429c0-35.328-24.576-57.197714-62.098286-57.197714z" p-id="6795"></path></svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>2</title>
+    <g id="2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组">
+            <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+            <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+            <g id="消息" transform="translate(1.500000, 0.330627)" fill-rule="nonzero">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="21" height="21"></rect>
+                <path d="M12.375,20.8465581 L12.481439,20.8533125 C12.8247806,20.8979809 13.05,21.1605815 13.05,21.5329218 C13.05,21.9061929 12.8231926,22.1712138 12.4745438,22.2133994 L12.4745438,22.2133994 L12.369085,22.2194605 L8.625,22.2192854 L8.51856095,22.2125311 C8.17521937,22.1678627 7.95,21.905262 7.95,21.5329218 C7.95,21.1596507 8.17680737,20.8946298 8.52545616,20.8524442 L8.52545616,20.8524442 L8.63091503,20.8463831 L12.375,20.8465581 Z M10.5,1.11928542 L10.518,1.12028542 L10.6067486,1.12608537 C10.8823216,1.16207049 11.0827652,1.33862074 11.1502336,1.60173001 L11.1691881,1.70434797 L11.1751648,1.81138832 L11.174,2.96819941 L11.2623551,3.06760509 L11.4699366,3.09194324 L11.7169493,3.12873834 C15.1566001,3.70083281 17.8052189,6.65135102 18.0339536,10.2136799 L18.0339536,10.2136799 L18.0460319,10.4648785 L18.0500129,10.7163433 L18.05,18.2002854 L18.1499256,18.3002854 L19.2499256,18.3011036 L19.3566944,18.3079035 C19.6667682,18.3483868 19.8817022,18.5667728 19.9191881,18.8861662 L19.9191881,18.8861662 L19.9251648,18.9932065 L19.9184209,19.1002704 C19.8784201,19.4115142 19.6633278,19.6299778 19.3495438,19.6679448 L19.3495438,19.6679448 L19.244085,19.674006 L1.75,19.674006 L1.64356095,19.6670765 C1.30021937,19.6224081 1.075,19.3598075 1.075,18.9874672 C1.075,18.6142067 1.30179797,18.3491752 1.65038278,18.3069894 L1.648,18.3062854 L1.691,18.3042854 L1.75581803,18.3009285 L2.85007438,18.3002854 L2.95,18.2002854 L2.95,10.71474 L2.95401023,10.4643007 C3.0740175,6.72062696 5.87395857,3.57344707 9.53315802,3.09161275 L9.53315802,3.09161275 L9.73577793,3.0675894 L9.82399996,2.96837143 L9.82499996,1.80573506 L9.83178712,1.69643473 C9.8677099,1.41423605 10.0440196,1.20878035 10.3078503,1.14227473 L10.3078503,1.14227473 L10.398,1.12428542 L10.495,1.11928542 L10.5,1.11928542 Z M16.599,18.3002854 L16.699,18.2002988 L16.7,10.7147533 L16.6958906,10.484234 C16.5756984,7.11769965 13.8343245,4.4011036 10.5,4.4011036 C7.17435962,4.4011036 4.42460885,7.10883932 4.30410828,10.484267 L4.30410828,10.484267 L4.30001588,10.7129577 L4.299,18.2002721 L4.399,18.3002854 L16.599,18.3002854 Z" id="形状结合" fill="#FFFFFF"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/icons/svg/alarmb.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>2</title>
+    <g id="2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="icon/banner/消息">
+            <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+            <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+            <g id="消息" transform="translate(1.500000, 0.330627)" fill="#000000" fill-rule="nonzero">
+                <rect id="矩形" opacity="0" x="0" y="0" width="21" height="21"></rect>
+                <path d="M12.375,20.8465581 L12.481439,20.8533125 C12.8247806,20.8979809 13.05,21.1605815 13.05,21.5329218 C13.05,21.9061929 12.8231926,22.1712138 12.4745438,22.2133994 L12.4745438,22.2133994 L12.369085,22.2194605 L8.625,22.2192854 L8.51856095,22.2125311 C8.17521937,22.1678627 7.95,21.905262 7.95,21.5329218 C7.95,21.1596507 8.17680737,20.8946298 8.52545616,20.8524442 L8.52545616,20.8524442 L8.63091503,20.8463831 L12.375,20.8465581 Z M10.5,1.11928542 L10.518,1.12028542 L10.6067486,1.12608537 C10.8823216,1.16207049 11.0827652,1.33862074 11.1502336,1.60173001 L11.1691881,1.70434797 L11.1751648,1.81138832 L11.174,2.96819941 L11.2623551,3.06760509 L11.4699366,3.09194324 L11.7169493,3.12873834 C15.1566001,3.70083281 17.8052189,6.65135102 18.0339536,10.2136799 L18.0339536,10.2136799 L18.0460319,10.4648785 L18.0500129,10.7163433 L18.05,18.2002854 L18.1499256,18.3002854 L19.2499256,18.3011036 L19.3566944,18.3079035 C19.6667682,18.3483868 19.8817022,18.5667728 19.9191881,18.8861662 L19.9191881,18.8861662 L19.9251648,18.9932065 L19.9184209,19.1002704 C19.8784201,19.4115142 19.6633278,19.6299778 19.3495438,19.6679448 L19.3495438,19.6679448 L19.244085,19.674006 L1.75,19.674006 L1.64356095,19.6670765 C1.30021937,19.6224081 1.075,19.3598075 1.075,18.9874672 C1.075,18.6142067 1.30179797,18.3491752 1.65038278,18.3069894 L1.648,18.3062854 L1.691,18.3042854 L1.75581803,18.3009285 L2.85007438,18.3002854 L2.95,18.2002854 L2.95,10.71474 L2.95401023,10.4643007 C3.0740175,6.72062696 5.87395857,3.57344707 9.53315802,3.09161275 L9.53315802,3.09161275 L9.73577793,3.0675894 L9.82399996,2.96837143 L9.82499996,1.80573506 L9.83178712,1.69643473 C9.8677099,1.41423605 10.0440196,1.20878035 10.3078503,1.14227473 L10.3078503,1.14227473 L10.398,1.12428542 L10.495,1.11928542 L10.5,1.11928542 Z M16.599,18.3002854 L16.699,18.2002988 L16.7,10.7147533 L16.6958906,10.484234 C16.5756984,7.11769965 13.8343245,4.4011036 10.5,4.4011036 C7.17435962,4.4011036 4.42460885,7.10883932 4.30410828,10.484267 L4.30410828,10.484267 L4.30001588,10.7129577 L4.299,18.2002721 L4.399,18.3002854 L16.599,18.3002854 Z" id="形状结合"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/icons/svg/chrome-old.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1660620397071" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="964" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M87.788 227.913c17.049 29.189 34.039 58.291 51.043 87.383 51.784 88.596 103.585 177.181 155.325 265.804 2.62 4.485 5.062 9.143 7 13.955C349.786 715.89 484.618 771.244 604.34 719.47c2.398-1.037 4.887-1.861 9.302-3.526-2.588 4.897-4.038 7.89-5.7 10.755-54.798 94.487-109.707 188.908-164.246 283.545-4.133 7.171-8.493 8.259-15.899 6.935-206.01-36.867-364.332-183.492-412.98-387.026-33.681-140.916-9.465-273.513 67.799-396.221a55.282 55.282 0 0 1 2.993-4.263c0.41-0.532 1.065-0.875 2.179-1.756zM637.574 322.251c4.879-0.232 7.832-0.494 10.785-0.495 109.636-0.021 219.273 0.08 328.908-0.221 8.034-0.021 11.143 2.592 13.896 9.949 77.165 206.263 15.492 437.682-155.167 576.728-99.718 81.243-214.648 119.245-343.254 115.541-4.101-0.116-8.19-0.579-13.782-0.991 2.282-4.327 3.863-7.594 5.678-10.723 73.799-127.297 147.568-254.609 221.459-381.853 61.326-105.603 35.165-231.359-63.311-303.663-1.275-0.936-2.452-2.003-5.212-4.272zM970.66 284.978h-15.17c-145.492 0-290.984-0.444-436.474 0.156-97.432 0.401-169.373 44.268-212.233 132.11-11.095 22.739-15.798 48.603-23.28 72.528-0.437-0.663-2.509-3.517-4.279-6.546-54.593-93.406-109.079-186.878-163.896-280.152-3.852-6.555-3.331-10.476 1.434-16.115C205.093 82.393 316.58 20.463 452.687 3.72c207.799-25.561 413.84 82.445 511.367 267.993 1.915 3.643 3.675 7.368 6.606 13.265zM702.425 512.551c-0.178 106.027-85.601 189.996-193.057 189.771-103.007-0.212-187.656-86.695-187.287-191.343 0.373-106.007 85.766-189.459 193.555-189.154 102.551 0.287 186.962 86.481 186.789 190.726z" p-id="965"></path></svg>

src/icons/svg/chrome.svg

@@ -1,2 +1,10 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1660620397071" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="964" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
-</style></defs><path d="M87.788 227.913c17.049 29.189 34.039 58.291 51.043 87.383 51.784 88.596 103.585 177.181 155.325 265.804 2.62 4.485 5.062 9.143 7 13.955C349.786 715.89 484.618 771.244 604.34 719.47c2.398-1.037 4.887-1.861 9.302-3.526-2.588 4.897-4.038 7.89-5.7 10.755-54.798 94.487-109.707 188.908-164.246 283.545-4.133 7.171-8.493 8.259-15.899 6.935-206.01-36.867-364.332-183.492-412.98-387.026-33.681-140.916-9.465-273.513 67.799-396.221a55.282 55.282 0 0 1 2.993-4.263c0.41-0.532 1.065-0.875 2.179-1.756zM637.574 322.251c4.879-0.232 7.832-0.494 10.785-0.495 109.636-0.021 219.273 0.08 328.908-0.221 8.034-0.021 11.143 2.592 13.896 9.949 77.165 206.263 15.492 437.682-155.167 576.728-99.718 81.243-214.648 119.245-343.254 115.541-4.101-0.116-8.19-0.579-13.782-0.991 2.282-4.327 3.863-7.594 5.678-10.723 73.799-127.297 147.568-254.609 221.459-381.853 61.326-105.603 35.165-231.359-63.311-303.663-1.275-0.936-2.452-2.003-5.212-4.272zM970.66 284.978h-15.17c-145.492 0-290.984-0.444-436.474 0.156-97.432 0.401-169.373 44.268-212.233 132.11-11.095 22.739-15.798 48.603-23.28 72.528-0.437-0.663-2.509-3.517-4.279-6.546-54.593-93.406-109.079-186.878-163.896-280.152-3.852-6.555-3.331-10.476 1.434-16.115C205.093 82.393 316.58 20.463 452.687 3.72c207.799-25.561 413.84 82.445 511.367 267.993 1.915 3.643 3.675 7.368 6.606 13.265zM702.425 512.551c-0.178 106.027-85.601 189.996-193.057 189.771-103.007-0.212-187.656-86.695-187.287-191.343 0.373-106.007 85.766-189.459 193.555-189.154 102.551 0.287 186.962 86.481 186.789 190.726z" p-id="965"></path></svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>3</title>
+    <g id="3" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="chrome-o备份" fill-rule="nonzero">
+            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M12.7426068,2.2146521 L12.7969308,2.21934763 L13.710624,2.37852186 L13.8758691,2.41111672 L14.1788117,2.47990569 C17.8083772,3.38984553 20.2183126,5.64775183 21.3576595,9.20681554 L21.4312071,9.45312684 C21.4424894,9.49407858 21.4533873,9.53539607 21.4640561,9.57770303 L21.5265612,9.84840829 L21.5910183,10.1727998 L21.7853479,11.2573932 L21.7800356,12.8004541 L21.6434884,13.5893768 L21.5856223,13.8887435 L21.5250256,14.1499693 C20.5620362,17.9780786 18.1617207,20.4349532 14.3625096,21.4705433 L14.1437836,21.5265071 L13.9137133,21.5771902 L13.4740829,21.6596966 L12.7426068,21.7854416 L11.1996505,21.7801487 L10.2834751,21.620599 L9.93360929,21.5474416 L9.82240675,21.5204237 C6.19289431,20.6111829 3.7827631,18.3541523 2.64317987,14.7958381 L2.56952614,14.5492643 L2.5050898,14.2938921 L2.44241633,13.9997935 L2.21455835,12.7427006 L2.21984617,11.199772 L2.37862691,10.2827451 L2.42714858,10.0429186 L2.47993468,9.82132437 C3.42439347,6.12371072 5.70744352,3.70983475 9.29593923,2.62735404 L9.7463242,2.50065857 L9.96673544,2.44825109 L10.3605303,2.37014553 L11.2572994,2.2146521 L12.7426068,2.2146521 Z M19.8184835,8.98242758 L17.8452559,8.98928786 L14.9675268,8.98709499 L15.0797892,9.10063515 C16.3213259,10.415573 16.6057788,12.2971205 15.7650723,13.9357578 L15.6541116,14.1392638 L11.9599009,20.4508985 L12.7565222,20.3999419 L13.0688801,20.3744215 L13.3296995,20.3453964 L13.5654615,20.3094959 C13.6041382,20.3027523 13.6428743,20.2955818 13.6822213,20.2879141 C18.6345664,19.3229989 21.6280381,14.1355163 20.0588392,9.36859749 L19.9720227,9.11812043 C19.9372981,9.02280001 19.9245375,8.99376084 19.8623201,8.98535805 L19.8184835,8.98242758 Z M4.65084236,7.78932117 L4.56424406,7.94798435 C3.4213887,10.0886924 3.19931203,12.295053 3.93454334,14.5371697 C4.93640021,17.5925026 7.03373243,19.4969892 10.189811,20.2723941 L10.5200771,20.3485817 C10.5838015,20.3623556 10.5888302,20.3684026 10.6099764,20.332771 L13.0943563,16.0777049 L12.9989912,16.1054787 C12.7989622,16.1602618 12.6660608,16.1894579 12.5271855,16.2051494 L12.4207667,16.2145748 C10.6168415,16.334373 9.21591352,15.605623 8.30414882,14.0584009 L6.61262152,11.158299 L4.65084236,7.78932117 Z M11.9929638,9.04613534 C10.3500684,9.04928839 9.04106198,10.3706195 9.04596815,12.0223123 C9.05081988,13.6444119 10.3772255,14.9584659 12.0068362,14.9543922 C13.6471232,14.95028 14.9674971,13.6178126 14.9549525,11.9796354 C14.9424363,10.3478671 13.6248992,9.04298847 11.9929638,9.04613534 Z M5.69719098,6.35076885 L5.46938856,6.60325105 C5.43203838,6.64588868 5.41753959,6.65640287 5.42320237,6.67714133 L7.90118893,10.9183074 L7.91414513,10.8757045 C8.46343996,9.03359313 9.95509795,7.86190859 11.8474474,7.76979085 L12.076418,7.76394483 L19.3270014,7.7650491 L19.2765877,7.67851428 C17.931894,5.47764056 16.0374498,4.13772493 13.5902231,3.69821656 L13.2678845,3.6459989 C10.288211,3.21475838 7.76432959,4.12699021 5.69719098,6.35076885 Z" id="形状结合" fill="#FFFFFF"></path>
+        </g>
+    </g>
+</svg>

src/icons/svg/chromeb.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>3</title>
+    <g id="3" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="chrome-o备份" fill-rule="nonzero">
+            <rect id="矩形" fill="#404040" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M12.7426068,2.2146521 L12.7969308,2.21934763 L13.710624,2.37852186 L13.8758691,2.41111672 L14.1788117,2.47990569 C17.8083772,3.38984553 20.2183126,5.64775183 21.3576595,9.20681554 L21.4312071,9.45312684 C21.4424894,9.49407858 21.4533873,9.53539607 21.4640561,9.57770303 L21.5265612,9.84840829 L21.5910183,10.1727998 L21.7853479,11.2573932 L21.7800356,12.8004541 L21.6434884,13.5893768 L21.5856223,13.8887435 L21.5250256,14.1499693 C20.5620362,17.9780786 18.1617207,20.4349532 14.3625096,21.4705433 L14.1437836,21.5265071 L13.9137133,21.5771902 L13.4740829,21.6596966 L12.7426068,21.7854416 L11.1996505,21.7801487 L10.2834751,21.620599 L9.93360929,21.5474416 L9.82240675,21.5204237 C6.19289431,20.6111829 3.7827631,18.3541523 2.64317987,14.7958381 L2.56952614,14.5492643 L2.5050898,14.2938921 L2.44241633,13.9997935 L2.21455835,12.7427006 L2.21984617,11.199772 L2.37862691,10.2827451 L2.42714858,10.0429186 L2.47993468,9.82132437 C3.42439347,6.12371072 5.70744352,3.70983475 9.29593923,2.62735404 L9.7463242,2.50065857 L9.96673544,2.44825109 L10.3605303,2.37014553 L11.2572994,2.2146521 L12.7426068,2.2146521 Z M19.8184835,8.98242758 L17.8452559,8.98928786 L14.9675268,8.98709499 L15.0797892,9.10063515 C16.3213259,10.415573 16.6057788,12.2971205 15.7650723,13.9357578 L15.6541116,14.1392638 L11.9599009,20.4508985 L12.7565222,20.3999419 L13.0688801,20.3744215 L13.3296995,20.3453964 L13.5654615,20.3094959 C13.6041382,20.3027523 13.6428743,20.2955818 13.6822213,20.2879141 C18.6345664,19.3229989 21.6280381,14.1355163 20.0588392,9.36859749 L19.9720227,9.11812043 C19.9372981,9.02280001 19.9245375,8.99376084 19.8623201,8.98535805 L19.8184835,8.98242758 Z M4.65084236,7.78932117 L4.56424406,7.94798435 C3.4213887,10.0886924 3.19931203,12.295053 3.93454334,14.5371697 C4.93640021,17.5925026 7.03373243,19.4969892 10.189811,20.2723941 L10.5200771,20.3485817 C10.5838015,20.3623556 10.5888302,20.3684026 10.6099764,20.332771 L13.0943563,16.0777049 L12.9989912,16.1054787 C12.7989622,16.1602618 12.6660608,16.1894579 12.5271855,16.2051494 L12.4207667,16.2145748 C10.6168415,16.334373 9.21591352,15.605623 8.30414882,14.0584009 L6.61262152,11.158299 L4.65084236,7.78932117 Z M11.9929638,9.04613534 C10.3500684,9.04928839 9.04106198,10.3706195 9.04596815,12.0223123 C9.05081988,13.6444119 10.3772255,14.9584659 12.0068362,14.9543922 C13.6471232,14.95028 14.9674971,13.6178126 14.9549525,11.9796354 C14.9424363,10.3478671 13.6248992,9.04298847 11.9929638,9.04613534 Z M5.69719098,6.35076885 L5.46938856,6.60325105 C5.43203838,6.64588868 5.41753959,6.65640287 5.42320237,6.67714133 L7.90118893,10.9183074 L7.91414513,10.8757045 C8.46343996,9.03359313 9.95509795,7.86190859 11.8474474,7.76979085 L12.076418,7.76394483 L19.3270014,7.7650491 L19.2765877,7.67851428 C17.931894,5.47764056 16.0374498,4.13772493 13.5902231,3.69821656 L13.2678845,3.6459989 C10.288211,3.21475838 7.76432959,4.12699021 5.69719098,6.35076885 Z" id="形状结合" fill="#000000"></path>
+        </g>
+    </g>
+</svg>

src/icons/svg/home-old.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1615188284589" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2221" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><defs><style type="text/css"></style></defs><path d="M998.428444 381.112889l-469.333333-353.180445c-0.469333-0.355556-0.981333-0.568889-1.479111-0.896a28.017778 28.017778 0 0 0-2.417778-1.464888 29.909333 29.909333 0 0 0-10.453333-3.128889 30.705778 30.705778 0 0 0-5.475556-0.014223 28.771556 28.771556 0 0 0-13.112889 4.707556c-0.412444 0.284444-0.867556 0.469333-1.28 0.782222l-469.333333 353.180445a28.458667 28.458667 0 0 0 34.204445 45.468444l73.656888-55.424V854.186667c0 111.701333 29.141333 147.555556 136.803556 147.555555h483.555556c107.662222 0 147.640889-35.854222 147.640888-147.555555V379.320889l62.805334 47.260444c5.12 3.854222 11.121778 5.717333 17.080889 5.717334a28.444444 28.444444 0 0 0 17.137777-51.185778zM443.747556 674.673778H580.266667c31.288889 0 36.707556 0.554667 36.707555 28.8v241.422222H417.877333V703.473778c0-28.245333-5.418667-28.8 25.870223-28.8z m400.782222-327.111111v506.666666c0 81.365333-14.193778 90.666667-90.752 90.666667h-108.359111V703.473778c0-48.967111-23.850667-57.244444-65.152-57.244445h-136.519111c-41.301333 0-54.314667 8.277333-54.314667 57.244445v241.422222H270.222222c-76.572444 0-79.914667-9.301333-79.914666-90.666667V347.562667c0-5.788444-1.749333-11.150222-4.721778-15.644445L512 86.272l334.336 251.591111a28.231111 28.231111 0 0 0-1.806222 9.699556z" fill="" p-id="2222"></path><path d="M435.370667 230.499556L250.055111 373.617778c-3.512889 2.688-2.858667 6.855111-2.858667 11.278222v161.777778a14.222222 14.222222 0 1 0 28.444445 0V391.907556l178.730667-138.837334c6.243556-4.778667 5.034667-13.710222 0.256-19.939555a13.425778 13.425778 0 0 0-19.256889-2.631111zM261.418667 589.340444a14.222222 14.222222 0 0 0-14.222223 14.222223v14.222222a14.222222 14.222222 0 1 0 28.444445 0v-14.222222a14.222222 14.222222 0 0 0-14.222222-14.222223z" fill="" p-id="2223"></path></svg>

src/icons/svg/home.svg

@@ -1 +1,10 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1615188284589" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2221" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><defs><style type="text/css"></style></defs><path d="M998.428444 381.112889l-469.333333-353.180445c-0.469333-0.355556-0.981333-0.568889-1.479111-0.896a28.017778 28.017778 0 0 0-2.417778-1.464888 29.909333 29.909333 0 0 0-10.453333-3.128889 30.705778 30.705778 0 0 0-5.475556-0.014223 28.771556 28.771556 0 0 0-13.112889 4.707556c-0.412444 0.284444-0.867556 0.469333-1.28 0.782222l-469.333333 353.180445a28.458667 28.458667 0 0 0 34.204445 45.468444l73.656888-55.424V854.186667c0 111.701333 29.141333 147.555556 136.803556 147.555555h483.555556c107.662222 0 147.640889-35.854222 147.640888-147.555555V379.320889l62.805334 47.260444c5.12 3.854222 11.121778 5.717333 17.080889 5.717334a28.444444 28.444444 0 0 0 17.137777-51.185778zM443.747556 674.673778H580.266667c31.288889 0 36.707556 0.554667 36.707555 28.8v241.422222H417.877333V703.473778c0-28.245333-5.418667-28.8 25.870223-28.8z m400.782222-327.111111v506.666666c0 81.365333-14.193778 90.666667-90.752 90.666667h-108.359111V703.473778c0-48.967111-23.850667-57.244444-65.152-57.244445h-136.519111c-41.301333 0-54.314667 8.277333-54.314667 57.244445v241.422222H270.222222c-76.572444 0-79.914667-9.301333-79.914666-90.666667V347.562667c0-5.788444-1.749333-11.150222-4.721778-15.644445L512 86.272l334.336 251.591111a28.231111 28.231111 0 0 0-1.806222 9.699556z" fill="" p-id="2222"></path><path d="M435.370667 230.499556L250.055111 373.617778c-3.512889 2.688-2.858667 6.855111-2.858667 11.278222v161.777778a14.222222 14.222222 0 1 0 28.444445 0V391.907556l178.730667-138.837334c6.243556-4.778667 5.034667-13.710222 0.256-19.939555a13.425778 13.425778 0 0 0-19.256889-2.631111zM261.418667 589.340444a14.222222 14.222222 0 0 0-14.222223 14.222223v14.222222a14.222222 14.222222 0 1 0 28.444445 0v-14.222222a14.222222 14.222222 0 0 0-14.222222-14.222223z" fill="" p-id="2223"></path></svg>
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>1</title>
+    <g id="1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" fill-rule="nonzero">
+            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M11.1710783,2.42919989 C11.7298936,2.09409047 12.4328291,2.12455473 12.9654367,2.52059014 L12.9654367,2.52059014 L20.3218013,7.99000647 L20.4665209,8.10559268 C21.0744501,8.62656431 21.4302636,9.40344805 21.4302636,10.227099 L21.4302636,10.227099 L21.4302636,19.0470569 L21.4250327,19.2212289 C21.3382831,20.6611171 20.1833875,21.8011882 18.7715031,21.8011882 L18.7715031,21.8011882 L5.2284969,21.8011882 L5.06035624,21.7957697 C3.67032883,21.7059084 2.56973638,20.5095861 2.56973638,19.0470569 L2.56973638,19.0470569 L2.56973638,10.2273587 L2.57600507,10.0381789 C2.63012926,9.22282649 3.03207443,8.47038558 3.67819781,7.99000711 L3.67819781,7.99000711 L11.034559,2.52059336 Z M12.0713092,3.55793652 C11.9772762,3.53774358 11.8769764,3.55793433 11.7954857,3.6185066 L11.7954857,3.6185066 L4.43911542,9.0879271 L4.32641124,9.18150853 C4.04059293,9.44596068 3.87451485,9.82573182 3.87451485,10.2273587 L3.87451485,10.2273587 L3.87451485,19.0470569 L3.880713,19.1821318 C3.94632222,19.8933667 4.52470053,20.4496068 5.2284969,20.4496068 L5.2284969,20.4496068 L11.2507497,20.4487759 L11.3507364,20.3451977 L11.3512202,14.4627186 L11.3582338,14.3683764 C11.4044406,14.0603828 11.6734228,13.8227675 12,13.8227675 C12.3345637,13.8227675 12.6123182,14.0734451 12.6454705,14.3976012 L12.6454705,14.3976012 L12.6489183,14.4681588 L12.6487364,20.3451881 L12.7487231,20.4487759 L18.7714898,20.4496068 L18.9018895,20.4431864 C19.5885066,20.3752237 20.1254851,19.7760987 20.1254851,19.0470569 L20.1254851,19.0470569 L20.1254851,10.2273587 L20.1177907,10.0779557 C20.0769951,9.68325297 19.8759128,9.32208831 19.5608746,9.08791971 L19.5608746,9.08791971 L12.2045243,3.61851399 L12.1402672,3.58065321 Z" id="形状结合" fill="#FFFFFF"></path>
+        </g>
+    </g>
+</svg>

src/icons/svg/homeb.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>1</title>
+    <g id="1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页" fill-rule="nonzero">
+            <rect id="矩形" fill="#404040" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M11.1710783,2.42919989 C11.7298936,2.09409047 12.4328291,2.12455473 12.9654367,2.52059014 L12.9654367,2.52059014 L20.3218013,7.99000647 L20.4665209,8.10559268 C21.0744501,8.62656431 21.4302636,9.40344805 21.4302636,10.227099 L21.4302636,10.227099 L21.4302636,19.0470569 L21.4250327,19.2212289 C21.3382831,20.6611171 20.1833875,21.8011882 18.7715031,21.8011882 L18.7715031,21.8011882 L5.2284969,21.8011882 L5.06035624,21.7957697 C3.67032883,21.7059084 2.56973638,20.5095861 2.56973638,19.0470569 L2.56973638,19.0470569 L2.56973638,10.2273587 L2.57600507,10.0381789 C2.63012926,9.22282649 3.03207443,8.47038558 3.67819781,7.99000711 L3.67819781,7.99000711 L11.034559,2.52059336 Z M12.0713092,3.55793652 C11.9772762,3.53774358 11.8769764,3.55793433 11.7954857,3.6185066 L11.7954857,3.6185066 L4.43911542,9.0879271 L4.32641124,9.18150853 C4.04059293,9.44596068 3.87451485,9.82573182 3.87451485,10.2273587 L3.87451485,10.2273587 L3.87451485,19.0470569 L3.880713,19.1821318 C3.94632222,19.8933667 4.52470053,20.4496068 5.2284969,20.4496068 L5.2284969,20.4496068 L11.2507497,20.4487759 L11.3507364,20.3451977 L11.3512202,14.4627186 L11.3582338,14.3683764 C11.4044406,14.0603828 11.6734228,13.8227675 12,13.8227675 C12.3345637,13.8227675 12.6123182,14.0734451 12.6454705,14.3976012 L12.6454705,14.3976012 L12.6489183,14.4681588 L12.6487364,20.3451881 L12.7487231,20.4487759 L18.7714898,20.4496068 L18.9018895,20.4431864 C19.5885066,20.3752237 20.1254851,19.7760987 20.1254851,19.0470569 L20.1254851,19.0470569 L20.1254851,10.2273587 L20.1177907,10.0779557 C20.0769951,9.68325297 19.8759128,9.32208831 19.5608746,9.08791971 L19.5608746,9.08791971 L12.2045243,3.61851399 L12.1402672,3.58065321 Z" id="形状结合" fill="#000000"></path>
+        </g>
+    </g>
+</svg>

src/icons/svg/orange_dot.svg

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>矩形备份 25</title>
+    <defs>
+        <rect id="path-1" x="0" y="234" width="6" height="6" rx="3"></rect>
+        <filter x="-100.0%" y="-100.0%" width="300.0%" height="300.0%" filterUnits="objectBoundingBox" id="filter-2">
+            <feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
+            <feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.301960784   0 0 0 0 0.0666666667  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="2-2工单管理" transform="translate(-1784.000000, -561.000000)">
+            <g id="编组-16备份-6" transform="translate(1016.000000, 229.000000)">
+                <g id="编组-19" transform="translate(32.000000, 64.000000)">
+                    <g id="编组-28备份-4" transform="translate(736.000000, 8.000000)">
+                        <g id="矩形备份-25" transform="translate(4.000000, 30.000000)">
+                            <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
+                            <use fill="#FF4D11" fill-rule="evenodd" xlink:href="#path-1"></use>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

src/layout/components/Navbar.vue

@@ -1,36 +1,33 @@
 <template>
-  <div class="navbar" :style="showTitle ? 'background: rgba(8,17,50,0.25)' : ''" style="padding-right: 23px;">
-    <hamburger
-      v-if="showhome"
-      id="hamburger-container"
-      :is-active="sidebar.opened"
-      class="hamburger-container"
-      @toggleClick="toggleSideBar"
-    />
-
-    <div
-      v-if="showTitle"
-      style="cursor: pointer; color: #fff;font-size: 22px; float: left; letter-spacing: 1px; font-weight: 500; padding-left: 24px; marginTop: 5px"
-      @click="goToRootPage"
-    >
-      <img
-        src="../../assets/img/cnbm.png"
-        style="width: 26px; height: 26px; position: relative; top: 6px; marginRight: 14px"
-        alt=""
-      >
-      {{ 'title' | i18nFilter }}
+  <div class="navbar" :style="showTitle ? 'background: rgba(8,17,50,0.25)' : ''">
+    <div v-if="showTitle" class="homeNavIcon" @click="goToRootPage">
+      <img src="../../assets/img/cnbm.png" alt="" />
+      <span>
+        {{ 'title' | i18nFilter }}
+      </span>
     </div>
 
-    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+    <div v-if="showhome" style="display:flex; align-items: center;">
+      <hamburger
+        id="hamburger-container"
+        :is-active="sidebar.opened"
+        class="hamburger-container"
+        @toggleClick="toggleSideBar"
+      />
+
+      <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
+    </div>
 
     <div class="right-menu">
-      <div v-if="showhome" class="right-menu-back" @click="toHome">
+      <div class="right-menu-back" @click="toHome">
         <svg-icon
           class="item-icon"
-          icon-class="home"
-          style="height: 24px; width: 24px; vertical-align: -6px; margin-right: 2px;"
+          :icon-class="showTitle ? 'home' : 'homeb'"
+          style="height: calc(24px * var(--beilv)); width: calc(24px * var(--beilv)); vertical-align: calc(-7px * var(--beilv)); margin-right: 2px;"
         />
-        {{ 'navbar.homepage' | i18nFilter }}
+        <span v-if="showhome">
+          {{ 'navbar.homepage' | i18nFilter }}
+        </span>
       </div>
       <el-dropdown
         :style="showTitle ? 'color: #fff' : '#000'"
@@ -41,10 +38,14 @@
           :hidden="alarmNum > 0 ? false : true"
           :value="alarmNum"
           class="item"
-          style="line-height: 0; margin: 0 10px; vertical-align: -3px"
+          style=" margin: 0 10px;  "
           @click.native="handleAlarm"
         >
-          <svg-icon style="width: 24px; height: 24px" class="item-icon" icon-class="alarm" />
+          <svg-icon
+            style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv)); vertical-align: calc(-4px * var(--beilv))"
+            class="item-icon"
+            :icon-class="showTitle ? 'alarm' : 'alarmb'"
+          />
         </el-badge>
         <el-dropdown-menu slot="dropdown">
           <el-dropdown-item>暂无数据</el-dropdown-item>
@@ -52,7 +53,7 @@
       </el-dropdown>
       <div :style="showTitle ? 'color: #fff' : ''" class="right-menu-back">
         <svg-icon
-          style="width: 24px; height: 24px; vertical-align: -7px"
+          style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv)); vertical-align: calc(-7px * var(--beilv))"
           :icon-class="showTitle ? 'countdown' : 'countdown2'"
         />
         {{ formatTime }}
@@ -68,7 +69,7 @@
         <a href="Lodap.zip">
           <svg-icon
             :style="showTitle ? 'color: #fff' : ''"
-            style="width: 24px; height: 24px; vertical-align: -7px"
+            style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv)); vertical-align: calc(-7px * var(--beilv))"
             icon-class="download"
           />
         </a>
@@ -77,8 +78,8 @@
         <a href="google.exe">
           <svg-icon
             :style="showTitle ? 'color: #fff' : ''"
-            style="width: 24px; height: 24px; vertical-align: -7px"
-            icon-class="chrome"
+            style="width: calc(24px * var(--beilv)); height: calc(24px * var(--beilv)); vertical-align: calc(-7px * var(--beilv))"
+            :icon-class="showTitle ? 'chrome' : 'chromeb'"
           />
         </a>
       </div>
@@ -96,7 +97,7 @@
         trigger="click"
       >
         <div class="avatar-wrapper">
-          <img :src="require('@/assets/img/head.png')" class="user-avatar">
+          <img :src="require('@/assets/img/head.png')" class="user-avatar" />
           <div class="avatar-username" :title="username">{{ username }}</div>
           <div class="avatar-roles" :title="roles.join(',')">{{ roles.length > 0 ? roles[0] : '' }}</div>
           <!-- <i class="el-icon-caret-bottom" /> -->
@@ -143,7 +144,7 @@
         <el-tooltip class="item" effect="dark" placement="bottom-end">
           <div slot="content">
             {{ 'copyright.copyright' | i18nFilter }}：{{ 'copyright.company' | i18nFilter }}
-            <br>
+            <br />
             {{ 'copyright.version' | i18nFilter }}：3.0
           </div>
           <svg-icon
@@ -296,8 +297,12 @@ export default {
       clearInterval(logoutInterval)
     },
     async toHome() {
-      this.$store.dispatch('app/setChoicepart')
-      this.$router.push('/')
+      if (this.showhome) {
+        this.$store.dispatch('app/setChoicepart')
+        this.$router.push('/')
+      } else {
+        this.goToRootPage()
+      }
     },
     handleAlarm() {},
     getAlarm() {
@@ -328,18 +333,49 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.time-menu {
-  display: inline-block;
-}
 .navbar {
-  height: 48px;
+  height: calc(48px * var(--beilv));
+  // height: calc(100vh / 1600 * 80);
   overflow: hidden;
   position: relative;
   background: #fff;
   box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+  // padding-right: calc(100vw / 2560 * 32);
+  padding-right: calc(24px * var(--beilv));
+
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .homeNavIcon {
+    cursor: pointer;
+    color: #fff;
+    line-height: 1;
+    font-weight: 500;
+    display: flex;
+    align-items: center;
+    // font-size: calc(100vw / 2560 * 28);
+    // letter-spacing: calc(100vw / 2560 * 2);
+    // padding-left: calc(100vw / 2560 * 32);
+    font-size: calc(24px * var(--beilv));
+    letter-spacing: calc(1px * var(--beilv));
+    padding-left: calc(24px * var(--beilv));
+
+    img {
+      width: calc(24px * var(--beilv));
+      height: calc(24px * var(--beilv));
+      margin-right: calc(12px * var(--beilv));
+      // width: calc(100vw / 2560 * 32);
+      // height: calc(100vw / 2560 * 32);
+      // margin-right: calc(100vw / 2560 * 16);
+      // width: 26px;
+      // height: 26px;
+      // marginright: 14px;
+    }
+  }
 
   .hamburger-container {
-    line-height: 48px;
+    // line-height: calc(48px * var(--beilv));
     height: 100%;
     float: left;
     cursor: pointer;
@@ -363,7 +399,7 @@ export default {
   .right-menu {
     float: right;
     height: 100%;
-    line-height: 48px;
+    line-height: calc(48px * var(--beilv));
     position: relative;
     &:focus {
       outline: none;
@@ -372,17 +408,17 @@ export default {
     .right-menu-back {
       display: inline-block;
       vertical-align: text-bottom;
-      font-size: 14px;
-      padding: 0 8px;
+      font-size: calc(14px * var(--beilv));
+      padding: 0 calc(8px * var(--beilv));
       text-align: center;
       cursor: pointer;
     }
 
     .right-menu-item {
       display: inline-block;
-      padding: 0 8px;
+      padding: 0 calc(8px * var(--beilv));
       height: 100%;
-      font-size: 18px;
+      font-size: calc(18px * var(--beilv));
       color: #5a5e66;
       vertical-align: text-bottom;
 
@@ -396,46 +432,46 @@ export default {
       }
     }
     .verticalBar {
-      height: 32px;
+      height: calc(32px * var(--beilv));
       width: 0;
       opacity: 0.49;
       padding: 0;
       border-right: 1px solid #fff;
       position: relative;
-      top: -8px;
+      top: calc(-1 * 8px * var(--beilv));
     }
     .avatar-container {
       .avatar-wrapper {
-        padding-top: 9px;
+        padding-top: calc(9px * var(--beilv));
         position: relative;
-        width: 140px;
-        height: 48px;
+        width: calc(140px * var(--beilv));
+        height: calc(48px * var(--beilv));
         .user-avatar {
           cursor: pointer;
-          width: 32px;
-          height: 32px;
-          border-radius: 16px;
+          width: calc(32px * var(--beilv));
+          height: calc(32px * var(--beilv));
+          border-radius: calc(16px * var(--beilv));
         }
         .avatar-username {
-          width: 80px;
+          width: calc(80px * var(--beilv));
           text-align: center;
           position: absolute;
-          font-size: 14px;
-          right: 13px;
-          top: 3px;
-          line-height: 25px;
+          font-size: calc(14px * var(--beilv));
+          right: calc(13px * var(--beilv));
+          top: calc(3px * var(--beilv));
+          line-height: calc(25px * var(--beilv));
           white-space: nowrap;
           text-overflow: ellipsis;
           overflow: hidden;
         }
         .avatar-roles {
-          width: 80px;
+          width: calc(80px * var(--beilv));
           text-align: center;
           position: absolute;
-          font-size: 14px;
-          top: 20px;
-          right: 13px;
-          line-height: 25px;
+          font-size: calc(14px * var(--beilv));
+          top: calc(20px * var(--beilv));
+          right: calc(13px * var(--beilv));
+          line-height: calc(25px * var(--beilv));
           white-space: nowrap;
           text-overflow: ellipsis;
           overflow: hidden;
@@ -444,9 +480,9 @@ export default {
         .el-icon-caret-bottom {
           cursor: pointer;
           position: absolute;
-          right: -20px;
-          top: 25px;
-          font-size: 12px;
+          right: calc(-1 * 20px * var(--beilv));
+          top: calc(25px * var(--beilv));
+          font-size: calc(12px * var(--beilv));
         }
       }
     }
@@ -455,13 +491,13 @@ export default {
 .dropdown-badge {
   background: #ff4949;
   color: #fff;
-  line-height: 16px;
-  border-radius: 8px;
-  padding: 0 8px;
+  line-height: calc(16px * var(--beilv));
+  border-radius: calc(8px * var(--beilv));
+  padding: 0 calc(8px * var(--beilv));
   float: right;
-  margin-left: 5px;
+  margin-left: calc(5px * var(--beilv));
   position: relative;
-  top: 7px;
+  top: calc(7px * var(--beilv));
 }
 .navbar-alarmbox {
   text-align: center;

src/layout/components/Sidebar/Logo.vue

@@ -6,15 +6,15 @@
  * @Description: file content
 -->
 <template>
-  <div class="sidebar-logo-container" :class="{'collapse':collapse}">
+  <div class="sidebar-logo-container" :class="{ collapse: collapse }">
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
-        <h1 v-else :style="{fontSize}" class="sidebar-title">{{ title }} </h1>
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 v-else :style="{ fontSize }" class="sidebar-title">{{ title }}</h1>
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo">
-        <h1 :style="{fontSize}" class="sidebar-title">{{ title }} </h1>
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 :style="{ fontSize }" class="sidebar-title">{{ title }}</h1>
       </router-link>
     </transition>
   </div>
@@ -58,10 +58,10 @@ export default {
 .sidebar-logo-container {
   position: relative;
   width: 100%;
-  height: 48px;
-  line-height: 48px;
+  height: calc(48px * var(--beilv));
+  line-height: calc(48px * var(--beilv));
   background: #001529;
-  padding-left: 10px;
+  padding-left: calc(10px * var(--beilv));
   overflow: hidden;
 
   & .sidebar-logo-link {
@@ -71,21 +71,24 @@ export default {
     & .sidebar-logo {
       width: 26px;
       height: 26px;
-      vertical-align: middle;
       margin-right: 12px;
+      // width: calc(26px * var(--beilv));
+      // height: calc(26px * var(--beilv));
+      // margin-right: calc(12px * var(--beilv));
+      vertical-align: middle;
     }
 
     & .sidebar-title {
       display: inline-block;
       margin: 0;
       color: #fff;
-      width: 189px;
+      // width: calc(189px * var(--beilv));
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
       font-weight: 500;
-      line-height: 50px;
-      font-size: 14px;
+      line-height: calc(50px * var(--beilv));
+      font-size: calc(14px * var(--beilv));
       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
       vertical-align: middle;
     }

src/views/3DOverview/components/DianChart.vue

@@ -31,7 +31,7 @@ export default {
     }
   },
   data() {
-    const colors = ['#5470C6', '#EE6666', '#339888']
+    const colors = ['#E02094', '#F0D63C', '#1A99FF']
 
     // const computeInterval = numArr => Math.floor(numArr.reduce((p, c) => p + c, 0) / numArr.length / 10) * 10
     let data = [
@@ -57,7 +57,7 @@ export default {
           textStyle: {
             color: '#fff9',
             fontSize: 8
-          },
+          }
           // data: ['ABC三相电压/v', 'ABC三相电流/a', '电缆温度']
         },
         grid: {
@@ -83,7 +83,7 @@ export default {
         yAxis: [
           {
             name: '电流/A',
-            nameTextStyle: { align: 'right', fontSize: 8 },
+            nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
             type: 'value',
             splitNumber: 4,
             onZero: true,
@@ -93,10 +93,14 @@ export default {
             axisLine: {
               show: true,
               lineStyle: {
-                color: '#fff9',
+                color: '#5982B2',
                 width: 1
               }
             },
+            axisLabel: {
+              color: '#fff9',
+              fontSize: 10
+            },
             splitLine: {
               show: false
               // lineStyle: {
@@ -106,7 +110,7 @@ export default {
           },
           {
             name: '电压/V',
-            nameTextStyle: { align: 'right', fontSize: 8 },
+            nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
             type: 'value',
             splitNumber: 4,
             axisTick: { show: false },
@@ -116,10 +120,14 @@ export default {
             axisLine: {
               show: true,
               lineStyle: {
-                color: '#fff9',
+                color: '#5982B2',
                 width: 1
               }
             },
+            axisLabel: {
+              color: '#fff9',
+              fontSize: 10
+            },
             splitLine: {
               show: false
               // lineStyle: {
@@ -129,7 +137,7 @@ export default {
           },
           {
             name: '温度',
-            nameTextStyle: { align: 'left', color: '#fff9', fontSize: 8 },
+            nameTextStyle: { align: 'left', color: '#fff9', fontSize: 9 },
             axisTick: { show: false },
             axisLine: {
               show: false,
@@ -144,6 +152,10 @@ export default {
               lineStyle: {
                 color: '#fff3'
               }
+            },
+            axisLabel: {
+              color: '#fff9',
+              fontSize: 10
             }
           }
         ],

src/views/3DOverview/components/FadianChart.vue

@@ -43,7 +43,7 @@ export default {
             color: '#fff9'
           }
         },
-        color: ['#59CBE8', '#E93CAC', '#FF7345', '#9452FF', '#6A6E87', '#52FFF1'],
+        color: ['#E02094', '#F0D63C', '#1A99FF'],
         grid: {
           top: '30%',
           left: 0,

src/views/3DOverview/components/LeftContentEquipmentCheck.vue

@@ -1,10 +1,16 @@
 <template>
   <div class="left-content-equipment-check">
-    <!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" />
-    <TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> -->
     <div class="el-table-wrapper fix-table">
-      <!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> -->
-      <el-table
+      <TechyTable
+        key="table-1"
+        :showIndex="false"
+        :page="1"
+        :limit="8"
+        :table-config="tableProps"
+        :table-data="tableData"
+      ></TechyTable>
+
+      <!-- <el-table
         key="LeftContentEquipmentCheck1"
         border
         :data="tableData"
@@ -12,11 +18,16 @@
       >
         <el-table-column label="设备名称" prop="eqName" align="center" />
         <el-table-column label="所属产线" prop="pl" align="center" />
-        <el-table-column label="提示等级" prop="warningLevel" align="center" />
-        <el-table-column label="提示等级" prop="checkContent" align="center" />
+        <el-table-column label="提示等级" prop="warningLevel" align="center">
+          <template slot-scope="scope">
+            <PriorityComponent :injectData="scope.row"></PriorityComponent>
+          </template>
+        </el-table-column>
+        <el-table-column label="巡检内容" prop="checkContent" align="center" />
       </el-table>
-    </div>
-    <!-- <div class="el-table-wrapper">
+    </div> -->
+
+      <!-- <div class="el-table-wrapper">
       <el-table
         key="LeftContentEquipmentCheck2"
         border
@@ -29,42 +40,76 @@
         <el-table-column label="提示等级" prop="checkContent" />
       </el-table>
     </div> -->
+    </div>
   </div>
 </template>
 
 <script>
-// import TechyFakeTable from './TechyFakeTable.vue'
-// import TechyTable from './TechyTable.vue'
+import TechyTable from './TechyTable.vue'
+
+const PriorityComponent = {
+  name: 'PriorityComponent',
+  props: {
+    injectData: Object
+  },
+  computed: {
+    bgColor() {
+      const colors = ['#9c4048', '#ffbd43', '#0b58ff', '#90dd48', '#449028', '#091238']
+      return colors[this.injectData.priority - 1]
+    },
+    priorityText() {
+      return ['一级', '二级', '三级', '四级', '五级'][this.injectData.priority - 1]
+    }
+  },
+  methods: {},
+  render: function(h) {
+    return h(
+      'span',
+      {
+        style: {
+          display: 'inline-block',
+          // borderRadius: '2px',
+          // padding: '2px 6px',
+          // color: '#fff',
+          // opacity: '0.6',
+          // fontSize: '12px',
+          borderRadius: 'calc(2px * var(--beilv))',
+          padding: 'calc(2px * var(--beilv)) calc(6px * var(--beilv))',
+          color: '#fff',
+          opacity: '0.6',
+          fontSize: 'calc(12px * var(--beilv))',
+          lineHeight: 1,
+          backgroundColor: this.bgColor
+        }
+      },
+      this.priorityText
+    )
+  }
+}
 
 const tableProps = [
-  { prop: 'eqName', label: '设备名称', width: 120, resizable: false },
-  { prop: 'pl', label: '所属产线', width: 120, resizable: false },
-  { prop: 'warningLevel', label: '提示等级', width: 120, resizable: false },
-  { prop: 'checkContent', label: '提示等级', width: 120, resizable: false }
+  { prop: 'eqName', label: '设备名称', align: 'center', 'min-width': 120 },
+  { prop: 'pl', label: '所属产线', align: 'center', 'min-width': 100 },
+  { prop: 'warningLevel', label: '提示等级', align: 'center', 'min-width': 100, subcomponent: PriorityComponent },
+  { prop: 'checkContent', label: '巡检内容', align: 'center', 'min-width': 120 }
 ]
 const tableData = [
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: '设备B', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' }
-  // { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
-  // { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
-]
-const tableData2 = [
-  { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
-  { eqName: '设备B', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' }
-  // { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
-  // { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
+  { eqName: 'A下片机', pl: '产线1', priority: 1, checkContent: '巡检内容' },
+  { eqName: 'A下片机', pl: '产线1', priority: 2, checkContent: '巡检内容' },
+  { eqName: 'A下片机', pl: '产线1', priority: 3, checkContent: '巡检内容' },
+  { eqName: 'A下片机', pl: '产线1', priority: 4, checkContent: '巡检内容' },
+  { eqName: 'A下片机', pl: '产线1', priority: 4, checkContent: '巡检内容' },
+  { eqName: 'A下片机', pl: '产线1', priority: 3, checkContent: '巡检内容' },
+  { eqName: '设备B', pl: '产线1', priority: 2, checkContent: '巡检内容' },
+  { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
+  { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
 ]
 
 export default {
   name: 'LeftContentEquipmentCheck',
-  components: {},
+  components: { TechyTable },
   data() {
-    return { tableProps, tableData, tableData2 }
+    return { tableProps, tableData }
   },
   created() {},
   mounted() {},

src/views/3DOverview/components/LeftContentMonitor.vue

@@ -33,8 +33,8 @@ export default {
 
 .monitor-pic {
   height: 100%;
-  width: 260px;
-  /* background-position: 100% 100%; */
+  flex: 1;
+  background-position: 100% 50%;
   background-size: cover;
   background-repeat: no-repeat;
 }

src/views/3DOverview/components/LeftContentOrder.vue

@@ -1,88 +1,64 @@
 <template>
-  <div class="left-content-equipment-check">
-    <!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" />
-    <TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> -->
-    <div class="el-table-wrapper fix-table">
-      <!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> -->
-      <el-table
-        key="LeftContentOrder1"
-        border
-        :data="tableData"
-        :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
-      >
-        <el-table-column
-          label="订单编号"
-          prop="orderCode"
-          :show-overflow-tooltip="true"
-          :resizable="true"
-          align="center"
-        />
-        <el-table-column
-          label="客户名称"
-          prop="clientName"
-          :show-overflow-tooltip="true"
-          :resizable="true"
-          align="center"
-        />
-        <el-table-column label="规格" prop="specs" :resizable="true" align="center" />
-        <el-table-column label="完成度" prop="finished" :resizable="true" align="center">
-          <template slot-scope="scope">
-            <el-progress
-              class="lb-progress-bar"
-              type="circle"
-              :percentage="scope.row.finished"
-              :width="18"
-              :stroke-width="2"
-              color="#47FF27"
-            />
-          </template>
-        </el-table-column>
-      </el-table>
-    </div>
-    <!-- <div class="el-table-wrapper">
-      <el-table
-        key="LeftContentOrder2"
-        border
-        :data="tableData2"
-        :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
-      >
-        <el-table-column label="订单编号" prop="orderCode" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="客户名称" prop="clientName" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="规格" prop="specs" :resizable="true" />
-        <el-table-column label="完成度" prop="finished" :resizable="true" />
-      </el-table>
-    </div> -->
+  <div class="left-content-order fix-table">
+    <techy-table :page="1" :limit="8" :show-index="false" :table-config="tableProps" :table-data="tableData" />
   </div>
 </template>
 
 <script>
-// import TechyFakeTable from './TechyFakeTable.vue'
-// import TechyTable from './TechyTable.vue'
+import TechyTable from './TechyTable.vue'
 
+const ProcessCircle = {
+  name: 'ProcessCircle',
+  props: {
+    injectData: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  mounted() {
+    console.log('finished', this.injectData.finished)
+  },
+  methods: {},
+  render: function(h) {
+    return h('el-progress', {
+      class: {
+        'lb-progress-bar': true
+      },
+      props: {
+        type: 'circle',
+        percentage: this.injectData.finished,
+        width: 14,
+        'stroke-width': 2,
+        color: '#47FF27'
+      },
+      style: {
+        color: 'blue'
+      }
+    })
+  }
+}
+
+const tableProps = [
+  { prop: 'orderCode', label: '订单编码', align: 'center', 'min-width': 120 },
+  { prop: 'clientName', label: '客户名称', align: 'center', 'min-width': 100 },
+  { prop: 'specs', label: '规格', align: 'center', 'min-width': 90 },
+  { prop: 'finished', label: '完成度', align: 'center', 'min-width': 80, subcomponent: ProcessCircle }
+]
 const tableData = [
-  { orderCode: 'DD202200910', clientName: '中建材', specs: '50cm', finished: 80 },
-  { orderCode: 'DD202200911', clientName: '蚌埠研究院', specs: '5mm', finished: 40 },
-  { orderCode: 'DD202200912', clientName: '中建材', specs: '50cm', finished: 77 },
-  { orderCode: 'DD202200913', clientName: '国资委', specs: '50cm', finished: 66 },
-  { orderCode: 'DD202200914', clientName: '合肥新能源', specs: '50cm', finished: 55 }
-  // { orderCode: 'DD202200915', clientName: '中信科技', specs: '50cm', finished: 77 }
-  // { orderCode: 'DD202200916', clientName: 'H', specs: '50cm', finished: 33 }
-]
-const tableData2 = [
   { orderCode: 'DD202200910', clientName: '中建材', specs: '50cm', finished: 80 },
   { orderCode: 'DD202200911', clientName: '蚌埠研究院', specs: '5mm', finished: 40 },
   { orderCode: 'DD202200912', clientName: '中建材', specs: '50cm', finished: 77 },
   { orderCode: 'DD202200913', clientName: '国资委', specs: '50cm', finished: 66 },
   { orderCode: 'DD202200914', clientName: '合肥新能源', specs: '50cm', finished: 55 },
-  { orderCode: 'DD202200915', clientName: '中信科技', specs: '50cm', finished: 77 }
-  // { orderCode: 'DD202200916', clientName: 'H', specs: '50cm', finished: 33 }
+  { orderCode: 'DD202200915', clientName: '中信科技', specs: '50cm', finished: 77 },
+  { orderCode: 'DD202200916', clientName: 'H', specs: '50cm', finished: 33 }
 ]
 
 export default {
   name: 'LeftContentOrder',
-  components: {},
+  components: { TechyTable },
   data() {
-    return { tableData, tableData2 }
+    return { tableData, tableProps }
   },
   created() {},
   mounted() {},
@@ -97,76 +73,17 @@ export default {
   text-align: left;
 }
 
-.left-content-equipment-check {
-  display: flex;
-  gap: calc(100vw / 1920 * 16);
+.left-content-order >>> .el-progress-circle {
+  position: relative;
+  left: calc(24px * var(--beilv));
+  width: calc(12px * var(--beilv)) !important;
+  height: calc(12px * var(--beilv)) !important;
 }
 
-.el-table-wrapper {
-  flex: 1;
-}
-
-.left-content-equipment-check > div {
-  overflow: hidden;
-  overflow-x: auto;
-}
-
-.el-table-wrapper >>> * {
-  background: transparent;
-}
-.el-table-wrapper >>> .el-table::before,
-.el-table-wrapper >>> .el-table--group::after,
-.el-table-wrapper >>> .el-table--border::after {
-  background: transparent;
-}
-
-.el-table-wrapper >>> .el-table {
-  font-size: 8px;
-  background-color: transparent;
-  color: #fff9;
-  border: 0;
-}
-
-.el-table-wrapper >>> .el-table th.is-leaf,
-.el-table-wrapper >>> .el-table td {
-  border-color: #0d1728;
-  padding: 0;
-}
-
-.el-table__row--striped:hover > td,
-.el-table-wrapper >>> .el-table__row:hover > td {
-  background-color: rgba(79, 114, 136, 0.29) !important;
-}
-
-.el-table-wrapper >>> table {
-  border: unset;
-}
-
-.el-table-wrapper >>> thead {
-  color: #fff;
-}
-.el-table-wrapper >>> tr {
-  background: unset;
-}
-.el-table-wrapper >>> tbody td > div,
-.el-table-wrapper >>> thead th > div {
-  white-space: nowrap;
-}
-.el-table-wrapper >>> th,
-.el-table-wrapper >>> td {
-  padding: 0;
-}
-
-.el-table-wrapper >>> tbody > tr:nth-child(even) {
-  background: rgba(76, 97, 123, 0.2);
-}
-
-.lb-progress-bar {
-  left: 30px;
-  display: flex;
-}
-.lb-progress-bar >>> .el-progress__text {
-  color: #fff9;
-  left: -75%;
+.left-content-order >>> .el-progress__text {
+  font-size: calc(12px * var(--beilv)) !important;
+  line-height: calc(14px * var(--beilv)) !important;
+  left: calc(-2px * var(--beilv));
+  color: #ffffffb3 !important;
 }
 </style>

src/views/3DOverview/components/LeftContentPublicConsume.vue

@@ -1,34 +1,9 @@
 <template>
   <div class="public-consume__inner">
-    <!-- <div class="water-area">
-      <TechyBarChart
-        :id="'water-chart'"
-        key="waterchart"
-        title="水"
-        :x-data="['自来水', '纯水', '循环水']"
-        :series-data="[8.2, 10, 6.1]"
-      />
-    </div>
-    <div class="elec-area">
-      <TechyLineChart :id="'elec-chart'" key="elecchart" title="电" />
-    </div>
-    <div class="elec-gen-area">
-      <TechyLineChart :id="'elec-gen-chart'" key="elecgenchart" title="发电" />
-    </div>
-    <div class="gas-area">
-      <TechyBarChart
-        :id="'gas-chart'"
-        key="gaschart"
-        title="气"
-        :x-data="['天然气', '氧气', 'CDA']"
-        :series-data="[8.2, 10, 6.1]"
-      />
-    </div> -->
-
     <div>
       <TechyBox class="water-consume">
-        <div class="header-part has-border">
-          <img src="./assets/consume/s.png" width="32" height="32" alt="water">
+        <div class="header-part">
+          <img src="./assets/consume/s.png" width="32" height="32" alt="water" />
           <span>水</span>
         </div>
         <div class="content-part">
@@ -62,8 +37,8 @@
 
     <div>
       <TechyBox class="gas-consume">
-        <div class="header-part has-border">
-          <img src="./assets/consume/gas.png" width="32" height="32" alt="qi">
+        <div class="header-part  ">
+          <img src="./assets/consume/gas.png" width="32" height="32" alt="qi" />
           <span>气</span>
         </div>
         <div class="content-part">
@@ -92,25 +67,25 @@
       </TechyBox>
     </div>
 
-    <div style="flex: 1;">
+    <div style="min-height: calc(110px * var(--beilv)); flex: 1;">
       <TechyBox class="dian-consume">
         <div class="header-part">
-          <img src="./assets/consume/d.png" width="32" height="32" alt="dian">
+          <img src="./assets/consume/d.png" width="32" height="32" alt="dian" />
           <span>电</span>
         </div>
-        <div class="content-part">
+        <div style="height: 100%; flex: 1;">
           <DianChart />
         </div>
       </TechyBox>
     </div>
 
-    <div style="flex: 1;">
+    <div style="min-height: calc(110px * var(--beilv)); flex: 1;">
       <TechyBox class="elec-consume">
         <div class="header-part">
-          <img src="./assets/consume/fad.png" width="32" height="32" alt="fadian">
+          <img src="./assets/consume/fad.png" width="32" height="32" alt="fadian" />
           <span>发电</span>
         </div>
-        <div class="content-part">
+        <div style="height: 100%; flex: 1; padding: calc(8px * var(--beilv))">
           <FadianChart />
         </div>
       </TechyBox>
@@ -138,48 +113,29 @@ export default {
 
 <style scoped>
 .public-consume__inner {
+  overflow: hidden;
+  overflow-y: auto;
   height: calc(100% - 32px);
   width: 100%;
-  /* display: grid;
-  grid-template-areas:
-    'water  elec      elec      gas'
-    'water  elec-gen  elec-gen  gas'; */
   display: flex;
   flex-direction: column;
-  gap: calc(100vmin / 1920 * 16);
+  gap: calc(8px * var(--beilv));
 }
 
-.water-area {
-  grid-area: water;
-}
-.gas-area {
-  grid-area: gas;
-}
-.elec-area {
-  grid-area: elec;
-}
-.elec-gen-area {
-  grid-area: elec-gen;
-}
-
-/* .elec-area,.elec-gen-area {
-  max-height: calc((100% - 32px) / 2 - 16px);
-} */
-
 .techy-box {
-  padding: calc(100vmin / 1920 * 16);
+  padding: calc(16px * var(--beilv));
   display: flex;
 }
 
 .header-part {
   height: 100%;
-  width: calc(100vmin / 1920 * 96);
+  width: calc(56px * var(--beilv));
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   /* overflow: hidden; */
-  margin-right: 16px;
+  margin-right: calc(16px * var(--beilv));
   position: relative;
 }
 
@@ -187,30 +143,32 @@ export default {
   content: '';
   position: absolute;
   top: 0;
-  right: -8px;
-  width: 1px;
+  right: calc(-8px * var(--beilv));
+  width: calc(1px * var(--beilv));
   height: 100%;
   background: linear-gradient(to bottom, transparent, #fff9, transparent);
 }
 
 .header-part > span {
   color: #fffc;
-  font-size: 0.8em;
+  font-size: calc(12px * var(--beilv));
 }
 
 .content-part {
   display: flex;
   flex-direction: column;
-  font-size: calc(100vmin / 1920 * 18);
+  font-size: calc(12px * var(--beilv));
   color: #fff9;
+  height: 10px;
   flex: 1 1;
-  gap: calc(100vmin / 1920 * 8);
+  gap: calc(4px * var(--beilv));
 }
 
 .row {
   display: flex;
   align-items: center;
   width: 100%;
+  height: calc(14px * var(--beilv));
 }
 
 .row > .name,
@@ -226,7 +184,7 @@ export default {
 .diy-process-bar {
   margin: 0 8px;
   border-radius: 7px;
-  height: 8px;
+  height: calc(8px * var(--beilv));
   flex: 1 1;
   background-color: #fff3;
   overflow: hidden;
@@ -236,7 +194,7 @@ export default {
 .diy-process-bar::after {
   content: '';
   position: absolute;
-  border-radius: 7px;
+  border-radius: calc(6px * var(--beilv));
   width: 30%;
   height: 100%;
 }
@@ -250,4 +208,16 @@ export default {
 .diy-process-bar.color-3::after {
   background: linear-gradient(to right, #ff8bc3, #eb46a1);
 }
+
+.dian-consume,
+.elec-consume {
+  padding: 0;
+}
+
+.dian-consume > .header-part,
+.elec-consume > .header-part {
+  padding: calc(16px * var(--beilv));
+  margin: 0;
+  margin-left: calc(16px * var(--beilv));
+}
 </style>

src/views/3DOverview/components/RightContentAlert.vue

@@ -1,39 +1,111 @@
 <template>
   <div class="right-content-alert">
     <div class="el-table-wrapper fix-table">
+      <TechyTable
+        key="table-1"
+        :showIndex="false"
+        :page="1"
+        :limit="8"
+        :table-config="tableProps"
+        :table-data="tableData"
+      ></TechyTable>
+      <!--       
       <el-table
         key="RightContentAlertTable"
         border
         :data="tableData"
         :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
       >
-        <el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" align="center" />
-        <el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" align="center" />
-        <el-table-column label="故障等级" prop="level" :resizable="true" align="center" />
+        <el-table-column
+          label="设备名称"
+          prop="eqName"
+          :show-overflow-tooltip="true"
+          :resizable="true"
+          align="center"
+        />
+        <el-table-column
+          label="所属产线"
+          prop="plName"
+          :show-overflow-tooltip="true"
+          :resizable="true"
+          align="center"
+        />
+        <el-table-column label="故障等级" prop="priority" :resizable="true" align="center">
+          <template slot-scope="scope">
+            <PriorityComponent :injectData="scope.row"></PriorityComponent>
+          </template>
+        </el-table-column>
         <el-table-column label="故障内容" prop="content" :resizable="true" align="center" />
         <el-table-column label="累计时间(min)" prop="duration" :resizable="true" align="center" :width="128" />
-      </el-table>
+      </el-table> -->
     </div>
   </div>
 </template>
 
 <script>
-// import TechyFakeTable from './TechyFakeTable.vue'
-// import TechyTable from './TechyTable.vue'
+import TechyTable from './TechyTable.vue'
+
+const PriorityComponent = {
+  name: 'PriorityComponent',
+  props: {
+    injectData: Object
+  },
+  computed: {
+    bgColor() {
+      const colors = ['#9c4048', '#ffbd43', '#0b58ff', '#90dd48', '#449028', '#091238']
+      return colors[this.injectData.priority - 1]
+    },
+    priorityText() {
+      return ['一级', '二级', '三级', '四级', '五级'][this.injectData.priority - 1]
+    }
+  },
+  methods: {},
+  render: function(h) {
+    return h(
+      'span',
+      {
+        style: {
+          display: 'inline-block',
+          // borderRadius: '2px',
+          // padding: '2px 6px',
+          // color: '#fff',
+          // opacity: '0.6',
+          // fontSize: '12px',
+          borderRadius: 'calc(2px * var(--beilv))',
+          padding: 'calc(2px * var(--beilv)) calc(6px * var(--beilv))',
+          color: '#fff',
+          opacity: '0.6',
+          fontSize: 'calc(12px * var(--beilv))',
+          lineHeight: 1,
+          backgroundColor: this.bgColor
+        }
+      },
+      this.priorityText
+    )
+  }
+}
+
+const tableProps = [
+  { prop: 'eqName', label: '设备名称', align: 'center', 'min-width': 100 },
+  { prop: 'plName', label: '所属产线', align: 'center', 'min-width': 100 },
+  { prop: 'priority', label: '提示等级', align: 'center', 'min-width': 100, subcomponent: PriorityComponent },
+  { prop: 'content', label: '巡检内容', align: 'center', 'min-width': 120 },
+  { prop: 'duration', label: '累计时间(min)', align: 'center', 'min-width': 128 }
+]
 
 const tableData = [
-  { eqName: 'A1下片机', plName: 'A', content: '123456', level: 3, duration: 10 },
-  { eqName: '磨片机', plName: 'A', content: '123456', level: 2, duration: 20 },
-  { eqName: 'B2钢化', plName: 'B', content: 'JQKA', level: 1, duration: 30 },
-  { eqName: '上片机', plName: 'C', content: 'xxx', level: 3, duration: 1 },
-  { eqName: '清洗机', plName: 'B', content: 'wowowowo', level: 2, duration: 2 }
+  { eqName: 'A1下片机', plName: 'A', content: '123456', priority: 3, duration: '10min' },
+  { eqName: '磨片机', plName: 'A', content: '123456', priority: 2, duration: '20min' },
+  { eqName: 'B2钢化', plName: 'B', content: 'JQKA', priority: 1, duration: '30min' },
+  { eqName: '上片机', plName: 'C', content: 'xxx', priority: 3, duration: '2min' },
+  { eqName: '清洗机', plName: 'B', content: 'wowowowo', priority: 2, duration: '3min' }
 ]
 
 export default {
   name: 'RightContentAlert',
-  components: {},
+  components: { TechyTable },
   data() {
-    return { tableData }
+    return {tableProps, tableData }
   },
   created() {},
   mounted() {},

src/views/3DOverview/components/RightContentFaultAnalysis.vue

@@ -87,44 +87,48 @@ export default {
       }
     ]
 
+    const demoData = [
+      { value: 55, name: 'A' },
+      { value: 33, name: 'B' },
+      { value: 22, name: 'C' },
+      { value: 11, name: 'D' },
+      { value: 32, name: 'E' }
+    ]
+
     return {
       chart: null,
       // default configs
       configs: {
         title: {
           textAlign: 'center',
-          left: '64%',
+          left: '63%',
           top: '35%',
           text: '33039',
           textStyle: {
             color: '#fff',
-            fontSize: 14,
+            fontSize: 16,
             fontWeight: 'normal'
           },
+          itemGap: 2,
           subtext: '总数',
           subtextStyle: {
             color: '#fff',
-            fontSize: 10,
+            fontSize: 12,
             fontWeight: 'lighter'
           }
         },
         legend: {
-          top: '5%',
-          bottom: '0%',
-          left: '-5%',
+          top: 0,
+          bottom: 0,
+          left: -10,
           orient: 'vertical',
           icon: 'none',
           itemGap: 5,
           itemWidth: 10,
           formatter: function(name) {
             // test data - dynamic
-            const testData = [
-              { name: 'A', value: 100 },
-              { name: 'B', value: 200 },
-              { name: 'C', value: 300 },
-              { name: 'D', value: 400 },
-              { name: 'E', value: 500 }
-            ]
+            const testData = demoData
+
             let pieLegendVale = {}
             testData.filter((item, index) => {
               if (item.name === name) {
@@ -142,7 +146,6 @@ export default {
           textStyle: {
             rich: {
               a: {
-                // align: 'center',
                 fontSize: 10,
                 color: 'rgba(255, 255, 255, 0.7)',
                 lineHeight: 16
@@ -207,7 +210,7 @@ export default {
             name: 'PieForm',
             type: 'pie',
             center: ['65%', '50%'],
-            radius: ['50%', '70%'],
+            radius: ['60%', '80%'],
             avoidLabelOverlap: true,
             label: {
               formatter: params => {
@@ -222,6 +225,10 @@ export default {
                 fifth: { color: '#49FBD6', fontSize: 8 }
               }
             },
+            labelLine: {
+              length: 5,
+              length2: 5
+            },
             itemStyle: {
               color: params => {
                 /** 计算渐变方向的过程，只靠 dataIndex 不太行 */
@@ -235,6 +242,11 @@ export default {
                   colorGradient.y = 0
                   colorGradient.x2 = 1
                   colorGradient.y2 = 1
+                } else if (totalRate + percent >= 50 && dataIndex === 1) {
+                  colorGradient.x = 1
+                  colorGradient.y = 1
+                  colorGradient.x2 = 0
+                  colorGradient.y2 = 0
                 } else if (totalRate + percent < 100) {
                   /** 也许这里需要完善，但目前工作良好 */
                   (() => {})()
@@ -244,36 +256,81 @@ export default {
                 return colorGradient
               }
             },
-            data: [
-              { value: 100, name: 'A' },
-              { value: 200, name: 'B' },
-              { value: 300, name: 'C' },
-              { value: 400, name: 'D' },
-              { value: 500, name: 'E' }
-            ]
+            data: demoData
           }
         ]
       }
     }
   },
   mounted() {
-    window.addEventListener('resize', function() {
+    window.addEventListener('resize', () => {
       if (this.chart) {
         this.chart.resize()
+        this.$nextTick(() => {
+          // 重新绘制文本大小
+          this.applyChartOption()
+        })
       }
     })
 
     this.$nextTick(() => {
       // if (!this.chart) this.chart = echarts.init(this.$refs.chartContainer, { width: '100%', height: '100%' })
       if (!this.chart) this.chart = echarts.init(this.$refs['fault-pie-chart'])
-
-      this.chart.setOption(this.configs)
-
+      this.applyChartOption()
       this.chart.resize()
     })
   },
 
-  methods: {}
+  methods: {
+    calcFontsize(baseSize) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return beilv * baseSize
+    },
+    applyChartOption() {
+      const fs1 = this.calcFontsize(1 /** px*/)
+      const fs3 = this.calcFontsize(3 /** px*/)
+      const fs5 = this.calcFontsize(5 /** px*/)
+      const fs8 = this.calcFontsize(8 /** px*/)
+      const fs10 = this.calcFontsize(10 /** px*/)
+      const fs14 = this.calcFontsize(14 /** px*/)
+      const fs16 = this.calcFontsize(16 /** px*/)
+
+      this.configs.title.textStyle.fontSize = fs14
+      this.configs.title.subtextStyle.fontSize = fs10
+
+      this.configs.legend.top = '10%'
+      this.configs.legend.itemGap = 0
+      this.configs.legend.itemWidth = fs8
+
+      this.configs.legend.textStyle.rich.a.fontSize = fs10
+      this.configs.legend.textStyle.rich.a.lineHeight = fs16
+      this.configs.legend.textStyle.rich.b.fontSize = fs10
+      // this.configs.legend.textStyle.rich.b.lineHeight = fs16
+      this.configs.legend.textStyle.rich.c.width = fs8
+      this.configs.legend.textStyle.rich.c.height = fs8
+      this.configs.legend.textStyle.rich.c.borderRadius = fs5
+      this.configs.legend.textStyle.rich.d.width = fs8
+      this.configs.legend.textStyle.rich.d.height = fs8
+      this.configs.legend.textStyle.rich.d.borderRadius = fs5
+      this.configs.legend.textStyle.rich.e.width = fs8
+      this.configs.legend.textStyle.rich.e.height = fs8
+      this.configs.legend.textStyle.rich.e.borderRadius = fs5
+      this.configs.legend.textStyle.rich.f.width = fs8
+      this.configs.legend.textStyle.rich.f.height = fs8
+      this.configs.legend.textStyle.rich.f.borderRadius = fs5
+      this.configs.legend.textStyle.rich.g.width = fs8
+      this.configs.legend.textStyle.rich.g.height = fs8
+      this.configs.legend.textStyle.rich.g.borderRadius = fs5
+
+      this.configs.series[0].label.rich.first.fontSize = fs10
+      this.configs.series[0].label.rich.second.fontSize = fs10
+      this.configs.series[0].label.rich.third.fontSize = fs10
+      this.configs.series[0].label.rich.fourth.fontSize = fs10
+      this.configs.series[0].label.rich.fifth.fontSize = fs10
+
+      this.chart.setOption(this.configs)
+    }
+  }
 }
 </script>
 

src/views/3DOverview/components/RightContentProductRate.vue

@@ -33,7 +33,7 @@ export default {
     return {
       chart: null,
       option: {
-        color: ['#59CBE8', '#E93CAC', '#E93CAC', '#FF7345', '#9452FF', '#6A6E87', '#52FFF1'],
+        color: ['#59CBE8', '#E93CAC', '#FF7345', '#9452FF', '#6A6E87', '#52FFF1'],
         grid: {
           top: '20%',
           left: 0,
@@ -98,6 +98,27 @@ export default {
             name: '产线1',
             type: 'line',
             symbol: 'none',
+            areaStyle: {
+              // color: 'rgba(50,145,152,0.5)'
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#59CBE866' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            },
             data: Array(12)
               .fill(0)
               .map(_ => Math.floor(Math.random() * 100))
@@ -106,6 +127,27 @@ export default {
             name: '产线2',
             type: 'line',
             symbol: 'none',
+            areaStyle: {
+              // color: 'rgba(50,145,152,0.5)'
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#E93CAC66' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            },
             data: Array(12)
               .fill(0)
               .map(_ => Math.floor(Math.random() * 100))
@@ -114,6 +156,27 @@ export default {
             name: '产线3',
             type: 'line',
             symbol: 'none',
+            areaStyle: {
+              // color: 'rgba(50,145,152,0.5)'
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#FF734566' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            },
             data: Array(12)
               .fill(0)
               .map(_ => Math.floor(Math.random() * 100))
@@ -122,6 +185,27 @@ export default {
             name: '产线4',
             type: 'line',
             symbol: 'none',
+            areaStyle: {
+              // color: 'rgba(50,145,152,0.5)'
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#9452FF66' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            },
             data: Array(12)
               .fill(0)
               .map(_ => Math.floor(Math.random() * 100))
@@ -130,6 +214,27 @@ export default {
             name: '产线5',
             type: 'line',
             symbol: 'none',
+            areaStyle: {
+              // color: 'rgba(50,145,152,0.5)'
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: '#6A6E8766' // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: 'transparent' // 100% 处的颜色
+                  }
+                ],
+                global: false // 缺省为 false
+              }
+            },
             data: Array(12)
               .fill(0)
               .map(_ => Math.floor(Math.random() * 100))
@@ -140,7 +245,6 @@ export default {
   },
   mounted() {
     this.$nextTick(() => {
-      console.log('here...')
       if (!this.chart) this.chart = echarts.init(this.$refs['techy-line-chart'])
       this.chart.setOption(this.option)
     })

src/views/3DOverview/components/RightContentQualityAnalysis.vue

@@ -53,7 +53,7 @@ export default {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-auto-rows: min-content;
-  gap: calc(100vmin / 1920 * 10) calc(100vmin / 1920 * 20);
+  gap: calc(4px * var(--beilv)) calc(6px * var(--beilv));
   justify-content: end;
 }
 

src/views/3DOverview/components/TechyAnalysisBar.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="quality-analysis-bar" :class="`border-${color}`">
     <div class="placeholder-block-wrapper">
-      <div class="justify-end">
+      <div class="flex justify-end">
         <div class="placeholder-block" :class="`block-${color}-1`" />
         <div class="placeholder-block" :class="`block-${color}-2`" />
         <div class="placeholder-block" :class="`block-${color}-3`" />
@@ -22,7 +22,7 @@ export default {
   filters: {
     amountFilter: val => {
       const sVal = val.toString()
-      return sVal.length > 10 ? sVal.slice(0, 8) + '...' : sVal
+      return sVal.length > 7 ? sVal.slice(0, 6) + '...' : sVal
     }
   },
   props: {
@@ -57,45 +57,43 @@ export default {
 
 .quality-analysis-bar {
   border-radius: 2px;
-  padding: 2px;
+  padding: calc(2px * var(--beilv));
   display: flex;
 }
 
 .border-green {
-  border: 1px solid #35abad;
+  border: 2px solid #35abad;
 }
 .border-blue {
-  border: 1px solid #49b2ff;
+  border: 2px solid #49b2ff;
 }
 .border-orange {
-  border: 1px solid #ffb94d;
+  border: 2px solid #ffb94d;
 }
 .border-pink {
-  border: 1px solid #ed879f;
+  border: 2px solid #ed879f;
 }
 
 .placeholder-block-wrapper {
   flex-grow: 1;
   overflow: hidden;
-  min-width: 32px;
+  min-width: calc(32px * var(--beilv));
   position: relative;
   display: flex;
   justify-content: center;
 }
 
 .placeholder-block-wrapper > div {
-  width: 200px;
+  width: calc(300px * var(--beilv));
   position: absolute;
   top: 0;
   right: 0;
-  display: flex;
 }
 
 .placeholder-block {
-  width: 20px;
-  height: 20px;
-  margin-left: 3px;
-  /* border-radius: 1px; */
+  width: calc(20px * var(--beilv));
+  height: calc(20px * var(--beilv));
+  margin-left: calc(3px * var(--beilv));
 }
 
 .block-green-5 {
@@ -175,24 +173,24 @@ export default {
 
 .quality-analysis-bar__name {
   text-align: center;
-  white-space: nowrap;
+  white-space: normal;
   overflow-wrap: break-word;
   overflow: hidden;
   color: white;
   display: inline-block;
-  padding: 3px 8px;
-  font-size: 14px;
-  line-height: 12px;
+  padding: calc(3px * var(--beilv)) calc(8px * var(--beilv));
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(12px * var(--beilv));
 }
 
 .quality-analysis-bar__amount {
   color: rgba(255, 255, 255, 0.725);
   display: inline-block;
   /* min-width: 35%; */
-  width: 50%;
+  width: 35%;
   text-align: left;
-  padding: 3px 0;
-  font-size: 14px;
-  line-height: 12px;
+  padding: calc(3px * var(--beilv)) 0;
+  font-size: calc(14px * var(--beilv));;
+  line-height: calc(12px * var(--beilv));;
 }
 </style>

src/views/3DOverview/components/TechyBox.vue

@@ -10,11 +10,12 @@ export default {}
 
 <style scoped>
 .techy-box {
-  background: transparent;
-  box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.5);
+  background: rgba(255, 255, 255, 0.0168);
+  box-shadow: inset 0 0 calc(17px * var(--beilv)) 0 rgba(255, 255, 255, 0.168);
   display: inline-block;
   height: 100%;
   width: 100%;
-  border-radius: .25rem;
+  border-radius: calc(4px * var(--beilv));
+  backdrop-filter: blur(2px);
 }
 </style>

src/views/3DOverview/components/TechyContainer.vue

@@ -12,7 +12,7 @@
     </template>
 
     <div class="container-title-wrapper">
-      <span class="container-icon" v-html="icon" />
+      <span class="container-icon" v-html="computeIcon" />
       <span class="container-title">{{ title }}</span>
     </div>
 
@@ -21,40 +21,50 @@
 </template>
 
 <script>
-const defaultIcon = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>质量上报</title>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-5质量管理" transform="translate(-384.000000, -254.000000)">
-            <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-3" fill="#6EF9E1"></path>
-                    <path d="M15.8982,17.8 L15.8982,20.15 C15.8622,20.495 16.1052,20.809 16.4482,20.86 L22.2982,20.86 C22.6462,20.814 22.8942,20.499 22.8582,20.15 L22.8582,17.73 C22.8582,17.56 22.7482,17.42 22.6282,17.42 C22.4772,17.441 22.3702,17.578 22.3882,17.73 L22.3882,20.24 L16.3882,20.24 L16.3882,17.72 C16.3882,17.56 16.2782,17.43 16.1582,17.43 C16.0382,17.43 15.9382,17.56 15.9282,17.72 L15.8982,17.8 Z M22.2982,21.04 L16.4582,21.04 C16.0112,20.992 15.6832,20.598 15.7182,20.15 L15.7182,17.67 C15.7192,17.449 15.8992,17.271 16.1202,17.2729833 C16.3392,17.274 16.5172,17.45 16.5182,17.67 L16.5182,20.1 L22.1782,20.1 L22.1782,17.78 C22.1422,17.551 22.2992,17.336 22.5282,17.3 C22.7572,17.265 22.9722,17.421 23.0082,17.651 C23.0152,17.694 23.0152,17.738 23.0082,17.78 L23.0082,20.2 C23.0182,20.619 22.7132,20.98 22.2982,21.04 L22.2982,21.04 Z" id="Fill-5" fill="#6EF9E1"></path>
-                    <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-7" fill="#6FFADE"></path>
-                    <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-9" fill="#6FFADE"></path>
-                    <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-11" fill="#6FFADE"></path>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-13" fill="#6EF9E1"></path>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Stroke-15" stroke="#6EF9E1" stroke-width="0.2"></path>
-                    <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-17" fill="#6FFADE"></path>
-                    <path d="M12.2967,6.8498 L11.9997,12.7348 C11.9267,13.1178 11.5587,13.3688 11.1757,13.2948 C10.8917,13.2418 10.6697,13.0188 10.6147,12.7348 L10.3057,6.8498 L10.3057,6.7878 C10.3937,6.2348 10.9127,5.8568 11.4647,5.9438 C11.8997,6.0118 12.2407,6.3528 12.3087,6.7878 C12.3137,6.8078 12.3137,6.8288 12.3087,6.8498 L12.2967,6.8498 Z M11.3077,15.4668 C10.9047,15.4878 10.5627,15.1778 10.5417,14.7758 C10.5217,14.3728 10.8317,14.0308 11.2337,14.0098 C11.6357,13.9898 11.9787,14.2988 11.9987,14.7018 C11.9997,14.7178 12.0007,14.7338 11.9997,14.7498 C12.0067,15.1388 11.6967,15.4598 11.3077,15.4668 Z" id="Fill-19" fill="#6EF9E1"></path>
-                    <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-21" fill="#6FFADE"></path>
-                    <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-23" fill="#6FFADE"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
+import {
+  IconMenuOnly,
+  IconTriple,
+  IconPCTriple,
+  IconPCAlert,
+  IconMenuSearch,
+  IconSafetyHat,
+  IconTrend,
+  IconMenu1
+} from './icons'
 
 export default {
   name: 'TechyContainer',
   props: {
     title: { type: String, default: '默认标题' },
-    icon: { type: String, default: defaultIcon },
+    icon: { type: String, default: 'defaultIcon' },
     showCorner: {
       type: Boolean,
       default: true
     }
   },
+  computed: {
+    computeIcon() {
+      switch (this.icon) {
+        case '折角的菜单图标':
+          return IconMenu1
+        case '趋势放大镜图标':
+          return IconTrend
+        case '菜单放大镜图标':
+          return IconMenuSearch
+        case '安全帽图标':
+          return IconSafetyHat
+        case '电脑警告图标':
+          return IconPCAlert
+        case '电脑警告菜单图标':
+          return IconPCTriple
+        case '菱形叠加':
+          return IconTriple
+        default:
+          return IconMenuOnly
+        // more...
+      }
+    }
+  },
   data() {
     return {}
   },
@@ -64,18 +74,16 @@ export default {
 
 <style scoped>
 .techy-container {
-  border: 2px solid #52fff1;
+  border: calc(2px * var(--beilv)) solid #52fff1;
   border-image: linear-gradient(90deg, rgba(82, 255, 241, 0.6), rgba(95, 190, 249, 0), rgba(82, 255, 241, 0.6)) 2 2;
   display: inline-block;
   position: relative;
-  /* padding: 24px; */
-  padding: calc(100vw / 1920 * 22);
+  padding: calc(24px * var(--beilv));
   width: 100%;
   height: 100%;
   box-shadow: inset 0px 0px 20px 0px rgba(255, 255, 255, 0.15);
-  /* background: rgba(20, 69, 100, 0.425); */
   background: rgba(6, 16, 39, 0.3);
-  backdrop-filter: blur(1px);
+  backdrop-filter: blur(2px);
 }
 
 .line {
@@ -84,58 +92,47 @@ export default {
 }
 
 .horizontal {
-  /* height: 4px;
-  width: 24px; */
-  /* height: 0.325vh;
-  width: 3vh; */
-  height: calc(100vw / 1920 * 4);
-  width: calc(100vw / 1920 * 30);
+  height: calc(4px * var(--beilv));
+  width: calc(26px * var(--beilv));
 }
 
 .vertical {
-  /* height: 24px;
-  width: 4px; */
-  /* height: 3vh;
-  width: 0.325vh; */
-  height: calc(100vw / 1920 * 30);
-  width: calc(100vw / 1920 * 4);
+  height: calc(26px * var(--beilv));
+  width: calc(4px * var(--beilv));
 }
 
 .top {
-  top: -3px;
+  top: calc(-3px * var(--beilv));
 }
 
 .left {
-  left: -3px;
+  left: calc(-3px * var(--beilv));
 }
 
 .right {
-  right: -3px;
+  right: calc(-3px * var(--beilv));
 }
 
 .bottom {
-  bottom: -3px;
+  bottom: calc(-3px * var(--beilv));
 }
 
 .container-title-wrapper {
   color: #52fff1;
   display: flex;
   align-items: center;
-  /* font-size: 18px;
+  font-size: calc(18px * var(--beilv));
   line-height: 1;
-  height: 24px;
-  margin-bottom: 8px; */
-  /* font-size: 1.25vh;
-  line-height: 1;
-  height: 1.5vh;
-  margin-bottom: 1.25vh; */
-  font-size: calc((100vw / 1920) * 16);
-  line-height: 1;
-  height: calc((100vw / 1920) * 20);
-  margin-bottom: 1.5vh;
+  margin-bottom: calc(8px * var(--beilv));
 }
 
 .container-title {
-  margin-left: 4px;
+  margin-left: calc(4px * var(--beilv));
+}
+
+.container-icon {
+  position: relative;
+  height: calc(24px * var(--beilv)) !important;
+  width: calc(24px * var(--beilv)) !important;
 }
 </style>

src/views/3DOverview/components/TechyHeader.vue

@@ -1,13 +1,13 @@
 <template>
   <header class="techy-header">
-    <img class="logo-img" src="./logo.png" alt="cnbm">
+    <img class="logo-img" src="./logo.png" alt="cnbm" />
     <span class="techy-header__title">{{ headTitle }}</span>
 
     <div class="date">2022.10.14</div>
     <div class="time">20:12:24</div>
 
     <div class="fullscreen-btn">
-      <span style="color: #52fff1; margin-right: 8px;" @click="handleClick('home')" v-html="homeSvg" />
+      <span @click="handleClick('home')" v-html="homeSvg" />
       <span v-if="isFullScreen" @click="handleClick('fullscreen')" v-html="unfullScreenSvg" />
       <span v-else @click="handleClick('fullscreen')" v-html="fullScreenSvg" />
     </div>
@@ -15,6 +15,8 @@
 </template>
 
 <script>
+import Cookie from 'js-cookie'
+
 // const homeSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 const homeSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>首页</title>
@@ -52,6 +54,7 @@ const unfullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32
         </g>
     </g>
 </svg>`
+
 export default {
   name: 'TechyHeader',
   props: ['headTitle'],
@@ -69,7 +72,14 @@ export default {
         this.isFullScreen = !this.isFullScreen
         this.$emit('toggle-full-screen', { full: this.isFullScreen })
       } else if (source === 'home') {
-        this.$router.push('/')
+        const username = Cookie.get('account')
+        const password = Cookie.get('password')
+
+        if (username && password) {
+          window.location = `http://192.168.1.103:9527/#/?username=${username}&password=${password}`
+        } else {
+          this.$router.push('/')
+        }
       }
     }
   }
@@ -80,8 +90,8 @@ export default {
 @font-face {
   font-family: 'zcoolqingkehuangyouti';
   src: url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff2') format('woff2'),
-      url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff') format('woff'),
-      url('./assets/fonts/zcoolqingkehuangyouti-Regular.ttf') format('truetype');
+    url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff') format('woff'),
+    url('./assets/fonts/zcoolqingkehuangyouti-Regular.ttf') format('truetype');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
@@ -94,72 +104,61 @@ export default {
   align-items: center;
   position: relative;
   color: white;
-  /* font-size: 24px; */
-  font-size: 2vh;
-  padding: calc(100vw / 1920 * 32) 0;
+  padding: calc(24px * var(--beilv)) 0;
   line-height: 1;
-  background: url(./header-longer.png) no-repeat;
-  /** 背景图片好像左右不对称 : */
-  /* background-position: bottom left 40px;  */
-  /* background-size: cover; */
+  background: url(./header-new.png) no-repeat;
   background-size: 100% 100%;
-  /* background-position: bottom left calc(100vw / 1920 * 40); */
+  /* background-position: bottom left calc(32px * var(--beilv)); */
   background-position: bottom;
-  height: calc(100vmin / 1920 * 128);
+  height: calc(96px * var(--beilv));
 }
 
 .logo-img {
-  width: calc(100vmin / 1920 * 48);
+  width: calc(28px * var(--beilv));
 }
 
 .techy-header__title {
   display: line-block;
-  margin-left: calc(100vmin / 1920 * 12);
-  /* font-size: 29px; */
-  font-size: calc(100vmin / 1920 * 48);
-  line-height: 41px;
-  letter-spacing: 4px;
-  text-shadow: 0px 0px 11px rgba(221, 237, 255, 0.34);
+  margin-left: calc(12px * var(--beilv));
+  font-size: calc(29px * var(--beilv));
+  line-height: calc(41px * var(--beilv));
+  letter-spacing: calc(4px * var(--beilv));
+  text-shadow: 0px 0px calc(11px * var(--beilv)) rgba(221, 237, 255, 0.34);
 }
 
 .date,
 .time {
   font-family: zcoolqingkehuangyouti, sans-serif;
-  font-size: calc(100vmin / 1920 * 42);
-  line-height: 1.5;
-  /* font-size: 28px;
-  line-height: 36px; */
+  font-size: calc(32px * var(--beilv));
+  line-height: calc(40px * var(--beilv));
   color: #49e1de;
-  letter-spacing: 0.8px;
+  letter-spacing: calc(0.8px * var(--beilv));
   position: absolute;
-  bottom: calc(100vmin / 1920 * 14);
+  bottom: calc(18px * var(--beilv));
 }
 
 .date {
-  /* left: 72px; */
-  left: calc(100vmin / 1920 * 72);
+  left: calc(72px * var(--beilv));
 }
 
 .time {
-  /* right: 128px; */
-  right: calc(100vmin / 1920 * 186);
+  right: calc(112px * var(--beilv));
 }
 
 .fullscreen-btn {
-  /* height: 32px; */
   cursor: pointer;
   position: absolute;
-  /* right: 24px;  */
   /** techy-body 的内部 padding 值 */
-  right: calc(100vmin / 1920 * 32);
-  /* top: 42px; */
-  top: calc(100vmin / 1920 * 52);
+  right: calc(24px * var(--beilv));
+  top: calc(40px * var(--beilv));
   bottom: 0;
+  display: flex;
+  gap: calc(8px * var(--beilv));
 }
 
 .fullscreen-btn > span {
   display: inline-block;
-  width: calc(100vmin / 1920 * 52);
-  height: calc(100vmin / 1920 * 52);
+  width: calc(32px * var(--beilv));
+  height: calc(32px * var(--beilv));
 }
 </style>

src/views/3DOverview/components/TechyTable.vue

@@ -7,15 +7,14 @@
 -->
 <template>
   <div class="visual-base-table-container">
-    <el-table
-      v-loading="isLoading"
-      :header-cell-style="{background:'rgba(79,114,136,0.29)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}"
-      :row-style="setRowStyle"
-      :data="renderData"
-      border
-      style="width: 100%; background: transparent"
-    >
-      <el-table-column v-if="page && limit && showIndex" prop="_pageIndex" :label="'tableHeader.index' | i18nFilter" :width="70 * beilv" align="center" />
+    <el-table class="techy-el-table" v-loading="isLoading" :data="renderData" border height="100%">
+      <el-table-column
+        v-if="page && limit && showIndex"
+        prop="_pageIndex"
+        :label="'tableHeader.index' | i18nFilter"
+        :width="70 * beilv"
+        align="center"
+      />
       <el-table-column
         v-for="(item, index) in renderTableHeadList"
         :key="item.prop"
@@ -23,10 +22,14 @@
         v-bind="item"
       >
         <template slot-scope="scope">
-
-          <component :is="item.subcomponent" v-if="item.subcomponent" :key="index" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
+          <component
+            :is="item.subcomponent"
+            v-if="item.subcomponent"
+            :key="index"
+            :inject-data="{ ...scope.row, ...item }"
+            @emitData="emitData"
+          />
           <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-
         </template>
       </el-table-column>
       <slot name="content" />
@@ -107,82 +110,101 @@ export default {
   methods: {
     emitData(val) {
       this.$emit('emitFun', val)
-    },
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(76,97,123,0.2)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      } else {
-        return {
-          background: 'rgba(79,114,136,0.29)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      }
-    },
-    setCellStyle(v) {
-      return {
-        lineHeight: 23 * this.beilv + 'px'
-      }
     }
   }
 }
 </script>
-<style lang="scss">
-@import "~@/styles/index.scss";
+
+<style scoped>
+.visual-base-table-container >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
+/* .visual-base-table-container {
+  min-width: 30vw;
+} */
 .visual-base-table-container {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
-
-  // new
-  .el-table {
-    width: 100%;
-    .el-table__header-wrapper table, .el-table__body-wrapper table {
-      width: 100% !important;
-    }
-
-    .el-table__body, .el-table__footer, .el-table__header {
-      table-layout: auto;
-    }
-  }
+  height: 100%;
 }
-.setting {
-  text-align: right;
-  padding: 15px;
-  .setting-box {
-    width: 100px;
-  }
-  i {
-    color: #aaa;
-    @extend .pointer;
-  }
+/* .visual-base-table-container >>> .el-table {
+  min-width: 120%;
+} */
+/* 清除默认样式 */
+.visual-base-table-container >>> th.gutter {
+  display: none;
+}
+.visual-base-table-container >>> table {
+  background: transparent;
 }
 
+.visual-base-table-container >>> .el-table,
+.visual-base-table-container >>> th,
+.visual-base-table-container >>> tr {
+  background: unset;
+}
+
+/* 设置设计稿样式 */
+.visual-base-table-container >>> .el-table::before,
+.visual-base-table-container >>> .el-table--group::after,
+.visual-base-table-container >>> .el-table--border::after,
+.visual-base-table-container >>> .el-table--border::after {
+  background: unset;
+}
+
+.visual-base-table-container >>> table * {
+  border-color: #0d1728;
+  border-width: calc(1px * var(--beilv));
+}
+
+.visual-base-table-container >>> td {
+  padding: calc(5px * var(--beilv));
+}
+
+.visual-base-table-container >>> td span {
+  color: #ffffffb3;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+}
+
+.visual-base-table-container >>> thead th {
+  padding: 0;
+}
+
+.visual-base-table-container >>> thead th .cell {
+  color: #fff;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  padding: calc(6px * var(--beilv));
+  white-space: nowrap;
+}
+
+.visual-base-table-container >>> .el-table__body tr:hover > td {
+  background-color: #42537130;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(odd) {
+  background-color: #0e203e90;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(even),
+.visual-base-table-container >>> .el-table thead {
+  background-color: #20376090;
+}
 </style>

src/views/3DOverview/components/icons.js

@@ -0,0 +1,394 @@
+// 扳手
+export const IconBanshou = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>setting tools</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M5.8599,18.0898 C6.4089,18.6418 7.3019,18.6448 7.8539,18.0958 C7.8559,18.0938 7.8579,18.0918 7.8599,18.0898 L14.5199,11.4298 L14.8899,11.4998 L15.0599,11.4998 C16.6169,11.7418 18.1089,10.7848 18.5399,9.2698 L18.2299,9.6198 C17.1349,10.6718 15.4049,10.6718 14.3099,9.6198 C13.2319,8.5358 13.2319,6.7838 14.3099,5.6998 L14.5999,5.4098 C13.0609,5.8908 12.1389,7.4618 12.4699,9.0398 L12.5499,9.4098 L5.8809,16.0798 C5.6139,16.3438 5.4659,16.7048 5.46982098,17.0798 C5.4729,17.4538 5.6199,17.8118 5.8809,18.0798 L5.8599,18.0898 Z M6.8599,19.8698 C6.1109,19.8828 5.3889,19.5898 4.8599,19.0598 C3.7809,17.9838 3.7769,16.2358 4.8529,15.1568 C4.8559,15.1538 4.8579,15.1518 4.8599,15.1498 L11.0099,8.9898 C10.7039,6.6548 12.2459,4.4768 14.5499,3.9898 L14.7799,3.9398 L15.0899,3.9398 C15.6049,3.8968 16.0939,4.1748 16.3199,4.6398 C16.4859,5.0968 16.3549,5.6088 15.9899,5.9298 L15.2299,6.6898 C14.6769,7.2388 14.6749,8.1318 15.2239,8.6838 L15.2299,8.6898 C15.7859,9.2338 16.6739,9.2338 17.2299,8.6898 L17.9899,7.9198 C18.2099,7.6868 18.5099,7.5478 18.8299,7.5298 C19.1509,7.5208 19.4599,7.6568 19.6709,7.8998 C19.9429,8.2518 20.0459,8.7058 19.9499,9.1398 C19.5749,11.5408 17.3609,13.2088 14.9499,12.9098 L8.7999,19.0598 C8.2859,19.5748 7.5889,19.8668 6.8599,19.8698 L6.8599,19.8698 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-7" fill="#6FFADE"></path>
+                <polygon id="Fill-9" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+                <path d="M5.3901,18.6099 C4.5621,17.8059 4.5411,16.4829 5.3451,15.6549 C5.3601,15.6399 5.3741,15.6249 5.3901,15.6099 L11.7891,9.2099 C11.3521,7.1479 12.6671,5.1199 14.7301,4.6799 L14.9301,4.6799 L15.1501,4.6799 C15.7401,4.6799 15.9301,5.1099 15.5501,5.4899 L14.7891,6.2499 C13.9611,7.0789 13.9611,8.4219 14.7891,9.2499 C15.6191,10.0789 16.9611,10.0789 17.7891,9.2499 L18.5501,8.4899 C18.6531,8.3769 18.7971,8.3079 18.9501,8.2999 C19.2201,8.2999 19.4301,8.5999 19.3501,9.1099 C19.0271,11.1909 17.0811,12.6169 15.0001,12.2999 L14.7901,12.2999 L8.3901,18.6999 C7.5861,19.5279 6.2631,19.5479 5.4351,18.7449 C5.4191,18.7299 5.4051,18.7149 5.3901,18.6999 L5.3901,18.6099 Z" id="Stroke-13" stroke="#6FFADE" stroke-width="1.5"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-15" fill="#6FFADE"></path>
+                <polygon id="Fill-17" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 趋势+放大镜
+export const IconTrend = `<svg  width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>analysis</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -533.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 509.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-25" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-27" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-29" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+齿轮
+export const IconMenuChilun = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+    <polygon id="path-3" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-1532.000000, -254.000000)">
+        <g id="编组-6" transform="translate(1508.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-5" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-8"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-7" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-9" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-11" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-13" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-15" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-17" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-19" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-21" fill="#6DF8E1"></path>
+                </g>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-23" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-25" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-28"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-27" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-29" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-31" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-33" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-35" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-37" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-39" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-41" fill="#6DF8E1"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 闪电安全帽
+export const IconSafetyHat = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>hatplus</title>
+<defs>
+    <linearGradient x1="100%" y1="100%" x2="20.318998%" y2="7.84095011e-14%" id="linearGradient-1">
+        <stop stop-color="#4BFFC8" offset="0%"></stop>
+        <stop stop-color="#45F2EC" offset="100%"></stop>
+    </linearGradient>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-998.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(974.000000, 230.000000)">
+            <g id="编组-6" transform="translate(24.000000, 24.000000)">
+                <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+                <g id="异常" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="17" height="17"></rect>
+                    <path d="M9.00003613,1.00009438 C7.45266489,0.991339384 5.96400493,1.59197413 4.85604619,2.6721807 C3.77420104,3.74179852 3.16375561,5.19879645 3.16005953,6.72012488 L3.16005953,14.5280306 L14.7760126,14.5280306 L14.7760126,6.72010926 C14.7746725,5.19671341 14.1605756,3.73789487 13.0720104,2.67216507 C11.9832986,1.60721536 10.5229694,1.00760431 9.0000205,1.00009438 L9.00003613,1.00009438 Z M8.52003548,12.6560576 L8.35203526,8.87208057 L5.48804703,8.87208057 L9.24800521,4.12815624 L9.56800564,7.18412206 L12.2880093,7.28012148 L8.48800418,12.6560576 L8.52003548,12.6560576 Z M1.00003551,16.1280053 C0.997937773,15.8953576 1.08886376,15.671504 1.25262424,15.5062394 C1.41638472,15.3409748 1.63939864,15.2480106 1.87205781,15.2480106 L16.1280144,15.2480106 C16.3586463,15.2508825 16.5792874,15.3425823 16.7440153,15.5040247 C16.9059435,15.6716664 16.9975415,15.894943 17,16.1280053 C17,16.6095886 16.6096013,17 16.1280144,17 L1.87205781,17 C1.39047096,17 1.00003551,16.6095886 1.00003551,16.1280053 L1.00003551,16.1280053 Z" id="形状" fill="url(#linearGradient-1)"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality = `<svg width="100%" height="100%"  viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量上报</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M15.8982,17.8 L15.8982,20.15 C15.8622,20.495 16.1052,20.809 16.4482,20.86 L22.2982,20.86 C22.6462,20.814 22.8942,20.499 22.8582,20.15 L22.8582,17.73 C22.8582,17.56 22.7482,17.42 22.6282,17.42 C22.4772,17.441 22.3702,17.578 22.3882,17.73 L22.3882,20.24 L16.3882,20.24 L16.3882,17.72 C16.3882,17.56 16.2782,17.43 16.1582,17.43 C16.0382,17.43 15.9382,17.56 15.9282,17.72 L15.8982,17.8 Z M22.2982,21.04 L16.4582,21.04 C16.0112,20.992 15.6832,20.598 15.7182,20.15 L15.7182,17.67 C15.7192,17.449 15.8992,17.271 16.1202,17.2729833 C16.3392,17.274 16.5172,17.45 16.5182,17.67 L16.5182,20.1 L22.1782,20.1 L22.1782,17.78 C22.1422,17.551 22.2992,17.336 22.5282,17.3 C22.7572,17.265 22.9722,17.421 23.0082,17.651 C23.0152,17.694 23.0152,17.738 23.0082,17.78 L23.0082,20.2 C23.0182,20.619 22.7132,20.98 22.2982,21.04 L22.2982,21.04 Z" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Stroke-15" stroke="#6EF9E1" stroke-width="0.2"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M12.2967,6.8498 L11.9997,12.7348 C11.9267,13.1178 11.5587,13.3688 11.1757,13.2948 C10.8917,13.2418 10.6697,13.0188 10.6147,12.7348 L10.3057,6.8498 L10.3057,6.7878 C10.3937,6.2348 10.9127,5.8568 11.4647,5.9438 C11.8997,6.0118 12.2407,6.3528 12.3087,6.7878 C12.3137,6.8078 12.3137,6.8288 12.3087,6.8498 L12.2967,6.8498 Z M11.3077,15.4668 C10.9047,15.4878 10.5627,15.1778 10.5417,14.7758 C10.5217,14.3728 10.8317,14.0308 11.2337,14.0098 C11.6357,13.9898 11.9787,14.2988 11.9987,14.7018 C11.9997,14.7178 12.0007,14.7338 11.9997,14.7498 C12.0067,15.1388 11.6967,15.4598 11.3077,15.4668 Z" id="Fill-19" fill="#6EF9E1"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-23" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality2 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量异常报警</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality3 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量缺陷分析</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 折角的菜单图标
+export const IconMenu1 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-1040.000000, -253.000000)">
+        <g id="编组-16备份-6" transform="translate(1016.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M16.3899,8.0902 C16.3899,8.5802 16.1899,8.8202 15.7999,8.8202 L10.0999,8.8202 C9.6999,8.8202 9.5099,8.5802 9.5099,8.0902 C9.5099,7.6002 9.6999,7.3702 10.0999,7.3702 L15.7999,7.3702 C16.1899,7.3702 16.3899,7.6102 16.3899,8.0902" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M14.51,11.95 C14.51,12.43 14.31,12.68 13.91,12.68 L10.11,12.68 C9.71,12.68 9.51,12.43 9.51,11.95 C9.51,11.47 9.71,11.23 10.11,11.23 L13.91,11.23 C14.31,11.23 14.51,11.47 14.51,11.95" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M12.5701,15.7801 C12.5701,16.2601 12.3701,16.5001 11.9601,16.5001 L10.1201,16.5001 C9.7101,16.5001 9.5101,16.2601 9.5101,15.7801 C9.5101,15.3001 9.7101,15.0601 10.1201,15.0601 L11.9601,15.0601 C12.3701,15.0601 12.5701,15.3001 12.5701,15.7801" id="Fill-7" fill="#6EF9E1"></path>
+                <path d="M8.0398,7.39 L8.0398,7.39 C8.4378,7.39 8.7598,7.712 8.7598,8.11 C8.7598,8.508 8.4378,8.83 8.0398,8.83 C7.6428,8.83 7.3198,8.508 7.3198,8.11 C7.3198,7.712 7.6428,7.39 8.0398,7.39" id="Fill-9" fill="#6DF8E1"></path>
+                <path d="M8.0398,11.2699 L8.0398,11.2699 C8.4378,11.2699 8.7598,11.5919 8.7598,11.9899 C8.7598,12.3879 8.4378,12.7099 8.0398,12.7099 C7.6428,12.7099 7.3198,12.3879 7.3198,11.9899 C7.3198,11.5919 7.6428,11.2699 8.0398,11.2699" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M8.0398,15.1502 L8.0398,15.1502 C8.4378,15.1502 8.7598,15.4722 8.7598,15.8702 C8.7598,16.2672 8.4378,16.5902 8.0398,16.5902 C7.6428,16.5902 7.3198,16.2672 7.3198,15.8702 C7.3198,15.4722 7.6428,15.1502 8.0398,15.1502" id="Fill-13" fill="#6DF8E1"></path>
+                <path d="M15.5501,19.7801 L15.5501,16.7801 L18.3401,16.7801 L15.5501,19.7801 Z M19.2201,9.6501 C18.7891,9.6501 18.4401,9.9991 18.4401,10.4301 C18.4401,10.4331 18.4401,10.4371 18.4401,10.4401 L18.4401,15.1501 L14.3801,15.1501 C14.1571,15.1551 13.9801,15.3371 13.9801,15.5601 L13.9801,20.0301 L6.6901,19.9601 C6.0901,19.9601 5.5901,19.1201 5.5901,18.5001 L5.5901,5.7801 C5.5901,5.1711 6.0811,4.6761 6.6901,4.6701 L17.3401,4.6701 C17.9491,4.6761 18.4401,5.1711 18.4401,5.7801 L18.4401,7.7801 C18.4411,8.2111 18.7911,8.5591 19.2211,8.5581 C19.6511,8.5581 19.9991,8.2101 20.0001,7.7801 L20.0001,4.7801 C19.9731,3.9181 19.2721,3.2301 18.4101,3.2201 L5.5001,3.2201 C4.6551,3.2251 3.9741,3.9151 3.98006066,4.7601 L4.0501,20.0901 C4.0441,20.9351 4.7251,21.6241 5.5701,21.6301 L14.8101,21.6301 L14.8701,21.6301 L14.9301,21.6301 L19.7401,17.0401 C19.8511,16.9251 19.9121,16.7701 19.9101,16.6101 L19.9101,10.6601 C20.0331,10.2411 19.7941,9.8021 19.3751,9.6791 C19.3241,9.6641 19.2731,9.6551 19.2201,9.6501 L19.2201,9.6501 Z" id="Fill-15" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+放大镜
+export const IconMenuSearch = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+安全帽
+export const IconPCAlert = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+三横
+export const IconPCTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -872.000000)">
+        <g id="编组-17备份" transform="translate(24.000000, 856.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M21.3174,18.5158014 L16.0874,18.5158014 C16.0584,18.5008014 16.0254,18.5008014 15.9974,18.5158014 C15.7554,18.6438014 15.6104,18.9018014 15.6274,19.1748014 C15.6274,19.5658014 15.8574,19.8748014 16.1364,19.8748014 L21.3174,19.8748014 C21.6074,19.8748014 21.8274,19.5658014 21.8274,19.1748014 C21.8274,18.7858014 21.6274,18.5158014 21.3174,18.5158014" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M21.3174,15.9564014 L16.0874,15.9564014 C16.0584,15.9414014 16.0254,15.9414014 15.9974,15.9564014 C15.7554,16.0844014 15.6104,16.3424014 15.6274,16.6154014 C15.6274,17.0064014 15.8574,17.3154014 16.1364,17.3154014 L21.3174,17.3154014 C21.6074,17.3154014 21.8274,17.0064014 21.8274,16.6154014 C21.8274,16.2264014 21.6274,15.9564014 21.3174,15.9564014" id="Fill-19备份" fill="#6FFADE"></path>
+                <path d="M21.3174,13.3970014 L16.0874,13.3970014 C16.0584,13.3820014 16.0254,13.3820014 15.9974,13.3970014 C15.7554,13.5250014 15.6104,13.7830014 15.6274,14.0560014 C15.6274,14.4470014 15.8574,14.7560014 16.1364,14.7560014 L21.3174,14.7560014 C21.6074,14.7560014 21.8274,14.4470014 21.8274,14.0560014 C21.8274,13.6670014 21.6274,13.3970014 21.3174,13.3970014" id="Fill-19备份-2" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 三个菱形叠加
+export const IconTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>物料信息 </title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -392.000000)" fill-rule="nonzero">
+        <g id="物料信息-" transform="translate(48.000000, 392.000000)">
+            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M20.3505422,14.9151538 L20.458789,14.9215423 C20.8283324,15.1756033 20.9365283,16.0632505 20.5345696,16.3962497 L20.4405365,16.4586841 L12.3478497,20.7032297 C12.2016803,20.79009 11.8833705,20.8006382 11.6976954,20.7375186 L11.6173217,20.699832 L3.53524588,16.5181762 C3.13421554,16.2396631 3.13620989,15.4741677 3.38080569,15.0736815 L3.44148439,14.9881289 L3.57039169,14.9618461 L11.9916374,19.3126195 L20.3505422,14.9151538 Z M20.3505455,11.1907368 L20.4587026,11.1970677 C20.8283142,11.4506321 20.936545,12.3384142 20.5345732,12.6714428 L20.4405365,12.7338816 L12.3478497,16.9784271 C12.2016803,17.0652875 11.8833705,17.0758357 11.6976954,17.012716 L11.6173217,16.9750295 L3.53524588,12.7933736 C3.13421554,12.5148606 3.13620989,11.7493651 3.38080569,11.348879 L3.44148439,11.2633264 L3.57039169,11.2370435 L11.9916374,15.5876251 L20.3505455,11.1907368 Z M12.4463389,3.3309719 L12.5600247,3.40332636 L20.3179067,7.46797471 C20.3828378,7.50198626 20.4422319,7.54565391 20.4941486,7.59757438 C20.8671243,7.97146203 20.8671243,8.57668705 20.4940313,8.95069207 L20.4111763,9.02185105 L20.3185938,9.07973137 L12.5536247,13.1569789 C12.2525083,13.3810327 11.8526139,13.4065554 11.5389056,13.2394459 L11.4256662,13.1677617 L3.66901765,9.16124436 C3.60269972,9.12706228 3.54205927,9.0828421 3.48915918,9.0300661 C3.30967167,8.85060515 3.20883441,8.60718793 3.20883441,8.35337304 C3.20883441,8.09955815 3.30967167,7.85614093 3.48911133,7.67672785 L3.57020807,7.60674321 L3.66079174,7.54945114 L11.4274137,3.41400371 C11.7293235,3.18803429 12.1313281,3.16229769 12.4463389,3.3309719 Z M12.0031732,4.74717805 L5.24637717,8.34632811 L11.9321821,11.8491065 L18.7348003,8.27501628 L12.0031732,4.74717805 Z" id="形状结合" stroke="#6EF9E1" stroke-width="0.2" fill="#77FFF2"></path>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单 only
+export const IconMenuOnly = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>菜单</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-384.000000, -253.000000)">
+        <g id="编组-16备份-5" transform="translate(360.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#CAE5DD" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.0901,3.8098 L16.6101,3.8098 L16.6101,4.7298 L18.0901,4.7298 C18.5481,4.7298 18.9201,5.1018 18.9201,5.5598 L18.9201,19.0898 C18.9201,19.5488 18.5481,19.9198 18.0901,19.9198 L5.9501,19.9198 C5.4911,19.9198 5.1201,19.5488 5.1201,19.0898 L5.1201,5.5598 C5.1201,5.1018 5.4911,4.7298 5.9501,4.7298 L7.6501,4.7298 L7.6501,3.8098 L5.9501,3.8098 C4.9861,3.8158 4.2051,4.5958 4.2001,5.5598 L4.2001,19.0898 C4.2051,20.0538 4.9861,20.8348 5.9501,20.8398 L18.1001,20.8398 C19.0641,20.8348 19.8441,20.0538 19.8501,19.0898 L19.8501,5.5598 C19.8441,4.5918 19.0581,3.8098 18.0901,3.8098" id="Fill-3" fill="#6EF9DE"></path>
+                <path d="M5.95,4.1702 C5.182,4.1702 4.56,4.7922 4.56,5.5602 L4.56,19.0902 C4.56,19.8582 5.182,20.4802 5.95,20.4802 L18.1,20.4802 C18.867,20.4802 19.49,19.8582 19.49,19.0902 L19.49,5.5602 C19.49,4.7922 18.867,4.1702 18.1,4.1702 L16.95,4.1702 L16.95,4.3402 L18.07,4.3402 C18.721,4.3402 19.25,4.8682 19.25,5.5202 L19.25,19.0502 C19.25,19.7012 18.721,20.2302 18.07,20.2302 L5.95,20.2302 C5.298,20.2302 4.77,19.7012 4.77,19.0502 L4.77,5.5602 C4.748,4.9082 5.258,4.3622 5.909,4.3402 C5.923,4.3402 5.936,4.3402 5.95,4.3402 L7.3,4.3402 L7.3,4.1302 L5.95,4.1702 Z M18.62,21.1902 L5.41,21.1902 C4.543,21.1902 3.84,20.4872 3.84,19.6202 L3.84,5.0302 C3.84,4.1632 4.543,3.4602 5.41,3.4602 L8,3.4602 L8,5.0902 L6.61,5.0902 C5.98,5.0902 5.47,5.6002 5.47,6.2302 L5.47,18.4202 C5.47,19.0492 5.98,19.5602 6.61,19.5602 L17.42,19.5602 C18.05,19.5602 18.56,19.0492 18.56,18.4202 L18.56,6.2302 C18.56,5.6002 18.05,5.0902 17.42,5.0902 L16.26,5.0902 L16.26,3.4602 L18.62,3.4602 C19.487,3.4602 20.19,4.1632 20.19,5.0302 L20.19,19.6202 C20.19,20.4872 19.487,21.1902 18.62,21.1902 L18.62,21.1902 Z" id="Fill-5" fill="#6EF9DE"></path>
+                <path d="M8.5101,2.5398 L15.6801,2.5398 C16.3151,2.5398 16.8301,3.0548 16.8301,3.6898 L16.8301,4.6398 C16.8301,5.2748 16.3151,5.7898 15.6801,5.7898 L8.5101,5.7898 C7.8751,5.7898 7.3601,5.2748 7.3601,4.6398 L7.3601,3.6898 C7.3601,3.0548 7.8751,2.5398 8.5101,2.5398" id="Fill-7" fill="#6EF9DE"></path>
+                <path d="M16.3299,8.5398 C16.3299,9.0398 16.1299,9.2898 15.7199,9.2898 L9.8299,9.2898 C9.4299,9.2898 9.2199,9.0398 9.2199,8.5398 C9.2199,8.0398 9.4299,7.7998 9.8299,7.7998 L15.7199,7.7998 C16.1299,7.7998 16.3299,8.0498 16.3299,8.5398" id="Fill-9" fill="#6EF9E1"></path>
+                <path d="M7.7,7.8098 L7.71,7.8098 C8.118,7.8098 8.45,8.1418 8.45,8.5498 L8.45,8.5598 C8.45,8.9688 8.118,9.2998 7.71,9.2998 L7.7,9.2998 C7.291,9.2998 6.96,8.9688 6.96,8.5598 L6.96,8.5498 C6.96,8.1418 7.291,7.8098 7.7,7.8098" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M16.3299,12.2698 C16.3299,12.7698 16.0499,13.0198 15.4799,13.0198 L10.0799,13.0198 C9.5099,13.0198 9.2199,12.7698 9.2199,12.2698 C9.2199,11.7698 9.5099,11.5198 10.0799,11.5198 L15.4799,11.5198 C16.0499,11.5198 16.3299,11.7698 16.3299,12.2698" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M7.7,11.5598 L7.71,11.5598 C8.118,11.5598 8.45,11.8918 8.45,12.2998 L8.45,12.3098 C8.45,12.7188 8.118,13.0498 7.71,13.0498 L7.7,13.0498 C7.291,13.0498 6.96,12.7188 6.96,12.3098 L6.96,12.2998 C6.96,11.8918 7.291,11.5598 7.7,11.5598" id="Fill-15" fill="#6DF8E1"></path>
+                <path d="M16.3299,16.0198 C16.3299,16.5198 16.1299,16.7698 15.7199,16.7698 L9.8299,16.7698 C9.4299,16.7698 9.2199,16.5198 9.2199,16.0198 C9.2199,15.5198 9.4299,15.2698 9.8299,15.2698 L15.7199,15.2698 C16.1299,15.2698 16.3299,15.5198 16.3299,16.0198" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M7.7,15.2898 L7.71,15.2898 C8.118,15.2898 8.45,15.6218 8.45,16.0298 L8.45,16.0398 C8.45,16.4488 8.118,16.7798 7.71,16.7798 L7.7,16.7798 C7.291,16.7798 6.96,16.4488 6.96,16.0398 L6.96,16.0298 C6.96,15.6218 7.291,15.2898 7.7,15.2898" id="Fill-19" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// TODO 放到 tech-container 里
+// let icon = '' 
+// switch (icon) {
+//     case 'menuIcon': return IconMenuOnly;
+//     case 'stackIcon': return IconTriple;
+//     case 'zhejiaoMenuListIcon': return IconMenu1;
+//     case 'trendAnalysisIcon': return IconTrend;
+//     case 'alertMenuIcon': return IconPCTriple;
+//     case 'lightHatIcon': return IconSafetyHat;
+//     case 'menuAnalysisIcon': return IconMenuSearch;
+//     case 'alertWarningIcon': return IconPCAlert;
+// }

src/views/3DOverview/components/newBar.vue

@@ -272,6 +272,7 @@ export default {
             show: false
           },
           axisLabel: {
+            margin: 12,
             textStyle: {
               fontSize: this.xlabelFontSize,
               color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
@@ -284,7 +285,7 @@ export default {
           axisLine: {
             lineStyle: {
               type: 'solid',
-              color: this.dataList[1].bottomColor,
+              color: this.dataList[0].bottomColor,
               // color: 'rgba(119, 255, 242, 0.6)', // 左边线的颜色
               width: '1' // 坐标线的宽度
             }
@@ -352,12 +353,12 @@ export default {
   /* bottom: calc(100vh/1920 * 80);
     left: calc(100vw/1920 * 48); */
   /* bottom: calc(10% + 100vh/1920 * 28); */
-  bottom: 8px;
+  bottom: 20px;
   left: 9%;
   height: 30px;
   width: 90%;
-  background: linear-gradient(to top, #31a2ff6d, transparent);
-  transform: skew(-45deg);
+  background: linear-gradient(to top, #49fbd789, transparent);
+  transform: skew(-35deg);
   z-index: 0;
 }
 </style>

src/views/3DOverview/index.vue

@@ -1,79 +1,89 @@
 <template>
   <div id="v3d-outter" ref="v3d-outter">
-    <V3DApp @3d-loaded="handle3DLoaded" />
-    <!-- 正式内容: -->
-    <div v-if="showPage" id="v3d-main-content">
-      <!-- <div v-if="true" id="v3d-main-content"> -->
+    <!-- <V3DApp @3d-loaded="handle3DLoaded" />
+    <div v-if="showPage" id="v3d-main-content"> -->
+    <div v-if="true" id="v3d-main-content">
       <techy-header :head-title="'合肥新能源数字工厂总览'" @toggle-full-screen="toggleFullScreen" />
 
       <section id="techy-body-part">
         <div class="upper-part">
           <div class="techy-body-part__left">
-            <techy-container title="订单完成情况" style="flex: 0;">
-              <LeftContentOrder />
-            </techy-container>
-            <techy-container title="公用工程消耗" style="flex:1;">
-              <LeftContentPublicConsume />
-            </techy-container>
+            <div class="order">
+              <techy-container title="订单完成情况" icon="default" style="display: flex; flex-direction: column;">
+                <LeftContentOrder style="height: 1px; flex: 1;" />
+              </techy-container>
+            </div>
+            <div class="public">
+              <techy-container title="公用工程消耗" icon="菱形叠加">
+                <LeftContentPublicConsume />
+              </techy-container>
+            </div>
+
+            <div class="techy-body-part__middle">
+              <TechyBox>
+                <div class="techy-body-part__middle__inner">
+                  <p>
+                    <b>产线名称 :</b>
+                    <span>A产线</span>
+                  </p>
+                  <p>
+                    <b>设备名称 :</b>
+                    <span>清洗机</span>
+                  </p>
+                  <p>
+                    <b>累计加工 :</b>
+                    <span>20</span>
+                  </p>
+                  <p>
+                    <b>通信状态 :</b>
+                    <span class="round-dot">运行中</span>
+                  </p>
+                </div>
+              </TechyBox>
+            </div>
           </div>
 
-          <div class="techy-body-part__middle">
-            <TechyBox>
-              <div class="techy-body-part__middle__inner">
-                <p>
-                  <b>产线名称 :</b>
-                  <span>A产线</span>
-                </p>
-                <p>
-                  <b>设备名称 :</b>
-                  <span>清洗机</span>
-                </p>
-                <p>
-                  <b>累计加工 :</b>
-                  <span>20</span>
-                </p>
-                <p>
-                  <b>通信状态 :</b>
-                  <span class="round-dot">运行中</span>
-                </p>
-              </div>
-            </TechyBox>
-          </div>
 
           <div class="techy-body-part__right">
-            <techy-container title="实时产量和能耗" style="height: 22vh">
-              <RightContentRealtimeProduction />
-            </techy-container>
+            <div class="realtime">
+              <techy-container title="实时产量和能耗" icon="折角的菜单图标">
+                <RightContentRealtimeProduction />
+              </techy-container>
+            </div>
 
-            <techy-container title="工序质量分析" style="flex: 0">
-              <RightContentQualityAnalysis />
-            </techy-container>
+            <div class="ws-quality">
+              <techy-container title="工序质量分析" icon="趋势放大镜图标">
+                <RightContentQualityAnalysis />
+              </techy-container>
+            </div>
 
-            <techy-container title="产线成品率" style="flex: 1">
-              <RightContentProductRate />
-            </techy-container>
+            <div class="production">
+              <techy-container title="产线成品率" icon="default">
+                <RightContentProductRate />
+              </techy-container>
+            </div>
           </div>
         </div>
 
         <!-- 底部 -->
         <div class="bottom-part">
-          <div style="width: 25%; min-width: 480px; height: 100%;">
-            <techy-container title="设备巡检提示" style="flex: 0; align-self: stretch;">
+          <div class="eq-check">
+            <techy-container title="设备巡检提示" icon="电脑警告菜单图标" style="flex: 0; align-self: stretch;">
               <LeftContentEquipmentCheck />
             </techy-container>
           </div>
-          <div>
-            <techy-container title="现场实时监控">
+          <div class="ft-monitor" style="flex: 1;">
+            <techy-container title="现场实时监控" icon="安全帽图标">
               <LeftContentMonitor />
             </techy-container>
           </div>
-          <div style="flex: 1;">
-            <techy-container title="缺陷分类分析">
+          <div class="fault-analysis">
+            <techy-container title="缺陷分类分析" icon="菜单放大镜图标">
               <RightContentFaultAnalysis />
             </techy-container>
           </div>
-          <div style="width: 25%; min-width: 480px;">
-            <techy-container title="设备报警提示">
+          <div class="eq-alert">
+            <techy-container title="设备报警提示" icon="电脑警告图标">
               <RightContentAlert />
             </techy-container>
           </div>
@@ -160,10 +170,11 @@ export default {
   -webkit-font-smoothing: antialiased;
   font-weight: 300;
   position: relative;
+  /* overflow: auto; */
 }
 
 #v3d-outter *::-webkit-scrollbar {
-  width: 8px;
+  width: calc(8px * var(--beilv));
 }
 
 #v3d-outter *::-webkit-scrollbar-track {
@@ -173,14 +184,14 @@ export default {
 }
 
 #v3d-outter *::-webkit-scrollbar-button {
-  width: 8px;
-  height: 8px;
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
   background: #5bc4bf9f;
   position: relative;
 }
 
 #v3d-outter *::-webkit-scrollbar-thumb {
-  border-radius: 8px;
+  border-radius: calc(8px * var(--beilv));
   background: #5bc4bf9f;
 }
 
@@ -195,64 +206,117 @@ export default {
 }
 
 #techy-body-part {
+  height: 20vh;
   flex: 1 1;
   display: flex;
-  /* gap: 16px; */
-  gap: calc(100vmin / 1920 * 36);
+  gap: calc(16px * var(--beilv));
   flex-direction: column;
 }
 
 .upper-part {
   flex: 1 1;
-  padding: calc(100vmin / 1920 * 36);
+  height: 20vh;
+  padding: calc(24px * var(--beilv));
   padding-bottom: 0;
   display: flex;
   justify-content: space-between;
+  gap: calc(16px * var(--beilv));
+}
+
+/* 订单完成情况 */
+.order {
+  height: calc(232px * var(--beilv));
+  flex: 0;
+}
+/* 公用工程消耗 */
+.public {
+  height: calc(472px * var(--beilv));
+  flex: 1;
+  overflow: hidden;
+}
+
+/* 实时产量和能耗 */
+.realtime {
+  height: calc(256px * var(--beilv));
+}
+/* 工序质量分析 */
+.ws-quality {
+  height: calc(228px * var(--beilv));
+  flex: 1;
+}
+/* 产线成品率 */
+.production {
+  height: calc(195px * var(--beilv));
 }
 
 .bottom-part {
-  height: 22vh;
-  padding: 0 calc(100vmin / 1920 * 36) calc(100vmin / 1920 * 36);
+  height: calc(224px * var(--beilv));
+  padding: 0 calc(24px * var(--beilv)) calc(24px * var(--beilv));
   display: flex;
-  /* gap: 16px; */
-  gap: calc(100vmin / 1920 * 36);
+  gap: calc(16px * var(--beilv));
+}
+
+/* 设备巡检提示 */
+.eq-check,
+.eq-alert {
+  width: calc(472px * var(--beilv));
+}
+
+/* 现场实时监控 */
+.ft-monitor {
+}
+
+/* 缺陷分类分析  */
+.fault-analysis {
+  width: calc(290px * var(--beilv));
+}
+
+/* 设备报警提示 */
+.eq-alert {
 }
 
 .techy-body-part__left,
 .techy-body-part__right {
-  height: 100%;
-  width: 25%;
-  min-width: 480px;
-  overflow: hidden;
-  /* background: rgba(20, 69, 100, 0.425);
-  backdrop-filter: blur(2px); */
+  /* height: 100%; */
+  /* height: calc(512px * var(--beilv));
+  flex: 1; */
+  width: calc(472px * var(--beilv));
+  overflow: unset;
 
   display: flex;
   flex-direction: column;
-  gap: calc(100vmin / 1920 * 36);
+  gap: calc(16px * var(--beilv));
+  position: relative;
 }
 
-/* .techy-body-part__left {
-  width: 35%;
-} */
-
 .techy-body-part__right-col-2 {
   flex: 1;
   display: flex;
   gap: calc(100vmin / 1920 * 36);
 }
 
+/* .techy-body-part__middle {
+  flex: 1;
+  position: relative;
+} */
+
 .techy-body-part__middle {
   position: absolute;
-  top: 9%;
-  left: 26%;
-  height: 136px;
-  width: 176px;
+  top: 0;
+  right: calc(-16px * var(--beilv));
+}
+
+.techy-body-part__middle .techy-box {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: calc(136px * var(--beilv));
+  width: calc(176px * var(--beilv));
 }
 
 .techy-body-part__middle__inner {
   height: 100%;
-  padding: 12px;
+  padding: calc(16px * var(--beilv));
   display: flex;
   flex-direction: column;
   justify-content: space-between;
@@ -261,23 +325,28 @@ export default {
 .techy-body-part__middle__inner p {
   margin: 0;
   padding: 0;
-  font-size: 12px;
+  font-size: calc(12px * var(--beilv));
   line-height: 1.5;
   color: #fff;
 }
 
 .techy-body-part__middle__inner p > span {
   position: relative;
-  padding-left: 16px;
+  padding-left: calc(16px * var(--beilv));
 }
+
+.techy-body-part__middle__inner p > span.round-dot {
+  padding-left: calc(28px * var(--beilv));
+}
+
 .round-dot::before {
   content: '';
   position: absolute;
-  top: 4px;
-  left: 2px;
-  width: 8px;
-  height: 8px;
+  top: calc(4px * var(--beilv));
+  left: calc(16px * var(--beilv));
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
   background-color: rgb(82, 231, 82);
-  border-radius: 4px;
+  border-radius: calc(4px * var(--beilv));
 }
 </style>

src/views/ChoicePart/index.vue

@@ -12,7 +12,7 @@
       >
         <!-- :style="{ background: colorArr.colorList[index % 9] }" -->
         <div class="choicepart-item-border">
-          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="">
+          <img :src="require(`../../assets/img/choicepart/${item.name}.png`)" alt="" />
         </div>
         <div class="choicepart-item-title" :title="item.meta.title">{{ item.meta.title }}</div>
       </div>
@@ -147,55 +147,57 @@ export default {
   background: url('../../assets/img/choicepart/choicepart-back.jpg') repeat;
   background-size: 100% 100%;
   overflow-x: scroll;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
   .choicepart-box {
-    width: 1440px;
-    margin: 0 auto;
-    margin: 0 auto;
-    padding-top: 16vh;
-    min-height: 100vh;
+    width: calc(1440px * var(--beilv));
+
     .choicepart-item {
       display: inline-block;
-      width: 208px;
-      height: 258px;
-      margin: 40px;
+      width: calc(208px * var(--beilv));
+      height: calc(258px * var(--beilv));
+      margin: calc(40px * var(--beilv));
       background: url('../../assets/img/choicepart/choice-item-back.png') no-repeat;
       background-size: 100% 100%;
       // border: 1px dashed #fff;
       // box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
       top: 0;
-      border-radius: 5px;
+      border-radius: calc(5px * var(--beilv));
       overflow: hidden;
       cursor: pointer;
       position: relative;
       img {
-        width: 208px;
-        height: 258px;
+        width: calc(208px * var(--beilv));
+        height: calc(258px * var(--beilv));
       }
       .choicepart-item-border {
         height: 100%;
-        border-radius: 5px;
+        border-radius: calc(5px * var(--beilv));
         // padding: 0 5px;
-        line-height: 32px;
-        font-size: 28px;
+        line-height: calc(32px * var(--beilv));
+        font-size: calc(28px * var(--beilv));
         font-weight: lighter;
         color: #2c6bd8;
         overflow: hidden;
       }
       .choicepart-item-title {
         overflow: hidden;
-        padding: 0 10px;
+        padding: 0 calc(10px * var(--beilv));
         text-overflow: ellipsis;
         white-space: nowrap;
         position: absolute;
         bottom: 0;
-        left: 2px;
-        right: 2px;
+        left: calc(2px * var(--beilv));
+        right: calc(2px * var(--beilv));
         text-align: center;
         color: #fff;
-        font-size: 16px;
-        line-height: 48px;
-        height: 48px;
-        letter-spacing: 2px;
+        font-size: calc(16px * var(--beilv));
+        line-height: calc(48px * var(--beilv));
+        height: calc(48px * var(--beilv));
+        letter-spacing: calc(2px * var(--beilv));
         background-color: rgba($color: #0b58ff, $alpha: 0.45);
       }
     }
@@ -219,15 +221,15 @@ export default {
 }
 ::-webkit-scrollbar {
   //滚动条的宽度
-  width: 9px;
-  height: 9px;
+  width: calc(9px * var(--beilv));
+  height: calc(9px * var(--beilv));
 }
 ::-webkit-scrollbar-thumb {
   //滚动条的设置
   background-color: #dddddd;
   background-clip: padding-box;
-  min-height: 28px;
-  border-radius: 9px;
+  min-height: calc(28px * var(--beilv));
+  border-radius: calc(9px * var(--beilv));
 }
 ::-webkit-scrollbar-thumb:hover {
   background-color: #bbb;

src/views/DataAnalysis/HomePage.vue

@@ -312,6 +312,7 @@ export default {
   font-size: 18px;
   line-height: 25px;
   letter-spacing: 6px;
+  transform: translateX(-2px);
 }
 
 .icon {

src/views/EquipmentManager/HomePage.vue

@@ -7,11 +7,11 @@
         <div class="row-1">
           <div class="equipment-exception">
             <!-- 设备报修/异常上报 -->
-            <techy-container :title="'设备报修/异常上报'" :icon="equipmentExceptionSVG">
+            <techy-container :title="'设备报修/异常上报'" icon="扳手螺丝刀">
               <div class="table-wrapper fix-table-exception-report">
                 <techy-table
                   :page="1"
-                  :limit="7"
+                  :limit="12"
                   :show-index="false"
                   :table-config="equipmentExceptionProps"
                   :table-data="equipmentExceptionDatalist"
@@ -21,11 +21,11 @@
           </div>
           <div class="equipment-alarm">
             <!-- 设备异常报警 -->
-            <techy-container :title="'设备异常报警'" :icon="equipmentAlarmSVG">
+            <techy-container :title="'设备异常报警'" icon="安全帽">
               <div class="table-wrapper fix-table-eq-exception">
                 <techy-table
                   :page="1"
-                  :limit="7"
+                  :limit="12"
                   :show-index="false"
                   :table-config="equipmentAlarmProps"
                   :table-data="equipmentAlarmDatalist"
@@ -36,16 +36,16 @@
         </div>
         <div class="row-2">
           <!-- 设备分析 -->
-          <techy-container :title="'设备分析'" :icon="equipmentAnalysisSVG">
+          <techy-container :title="'设备分析'" icon="趋势搜索">
             <select id="productLine" name="productLine" class="product-line-selection">
               <option value="1">产线一</option>
               <option value="2">产线二</option>
               <option value="3">产线三</option>
             </select>
-            <div class="grid columns-2" style="height: calc(100% - 32px)">
-              <div class="pl-jdl">
-                <TechyBox style="padding: calc(100vh / 1920 * 24)">
-                  <h2
+            <div class="equipment-analysis__inner">
+              <div>
+                <TechyBox class="pl-jdl">
+                  <!-- <h2
                     :style="{
                       margin: 0,
                       padding: 0,
@@ -54,10 +54,10 @@
                       lineHeight: '18px',
                       fontSize: '0.85vw'
                     }"
-                  >
-                    <!-- fontSize: '15px', -->
+                  > 
                     各产线稼动率
-                  </h2>
+                  </h2> -->
+                  <span class="pl-jdl__title">各产线稼动率</span>
                   <pl-jdl-chart />
                 </TechyBox>
               </div>
@@ -76,20 +76,22 @@
         </div>
         <div class="row-3">
           <!-- 设备备件管理 -->
-          <techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG">
-            <techy-table
-              :page="1"
-              :limit="7"
-              :show-index="false"
-              :table-config="sparepartsProps"
-              :table-data="sparepartsDatalist"
-            />
+          <techy-container :title="'设备备件管理'" icon="清单齿轮">
+            <div class="table-wrapper fix-table-exception-report">
+              <techy-table
+                :page="1"
+                :limit="12"
+                :show-index="false"
+                :table-config="sparepartsProps"
+                :table-data="sparepartsDatalist"
+              />
+            </div>
           </techy-container>
         </div>
       </div>
 
       <div class="tech-body__col-2">
-        <techy-container :title="'设备工单管理'" :icon="equipmentOrderSVG">
+        <techy-container :title="'设备工单管理'" icon="清单齿轮">
           <!-- 设备工单管理 -->
           <div class="techy-container__inner">
             <div>
@@ -141,124 +143,6 @@ import {
 import { mapGetters } from 'vuex'
 import screenfull from 'screenfull'
 
-const equipmentExceptionSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>setting tools</title>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-4设备管理" transform="translate(-384.000000, -254.000000)">
-            <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M5.8599,18.0898 C6.4089,18.6418 7.3019,18.6448 7.8539,18.0958 C7.8559,18.0938 7.8579,18.0918 7.8599,18.0898 L14.5199,11.4298 L14.8899,11.4998 L15.0599,11.4998 C16.6169,11.7418 18.1089,10.7848 18.5399,9.2698 L18.2299,9.6198 C17.1349,10.6718 15.4049,10.6718 14.3099,9.6198 C13.2319,8.5358 13.2319,6.7838 14.3099,5.6998 L14.5999,5.4098 C13.0609,5.8908 12.1389,7.4618 12.4699,9.0398 L12.5499,9.4098 L5.8809,16.0798 C5.6139,16.3438 5.4659,16.7048 5.46982098,17.0798 C5.4729,17.4538 5.6199,17.8118 5.8809,18.0798 L5.8599,18.0898 Z M6.8599,19.8698 C6.1109,19.8828 5.3889,19.5898 4.8599,19.0598 C3.7809,17.9838 3.7769,16.2358 4.8529,15.1568 C4.8559,15.1538 4.8579,15.1518 4.8599,15.1498 L11.0099,8.9898 C10.7039,6.6548 12.2459,4.4768 14.5499,3.9898 L14.7799,3.9398 L15.0899,3.9398 C15.6049,3.8968 16.0939,4.1748 16.3199,4.6398 C16.4859,5.0968 16.3549,5.6088 15.9899,5.9298 L15.2299,6.6898 C14.6769,7.2388 14.6749,8.1318 15.2239,8.6838 L15.2299,8.6898 C15.7859,9.2338 16.6739,9.2338 17.2299,8.6898 L17.9899,7.9198 C18.2099,7.6868 18.5099,7.5478 18.8299,7.5298 C19.1509,7.5208 19.4599,7.6568 19.6709,7.8998 C19.9429,8.2518 20.0459,8.7058 19.9499,9.1398 C19.5749,11.5408 17.3609,13.2088 14.9499,12.9098 L8.7999,19.0598 C8.2859,19.5748 7.5889,19.8668 6.8599,19.8698 L6.8599,19.8698 Z" id="Fill-5" fill="#6FFADE"></path>
-                    <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-7" fill="#6FFADE"></path>
-                    <polygon id="Fill-9" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
-                    <path d="M5.3901,18.6099 C4.5621,17.8059 4.5411,16.4829 5.3451,15.6549 C5.3601,15.6399 5.3741,15.6249 5.3901,15.6099 L11.7891,9.2099 C11.3521,7.1479 12.6671,5.1199 14.7301,4.6799 L14.9301,4.6799 L15.1501,4.6799 C15.7401,4.6799 15.9301,5.1099 15.5501,5.4899 L14.7891,6.2499 C13.9611,7.0789 13.9611,8.4219 14.7891,9.2499 C15.6191,10.0789 16.9611,10.0789 17.7891,9.2499 L18.5501,8.4899 C18.6531,8.3769 18.7971,8.3079 18.9501,8.2999 C19.2201,8.2999 19.4301,8.5999 19.3501,9.1099 C19.0271,11.1909 17.0811,12.6169 15.0001,12.2999 L14.7901,12.2999 L8.3901,18.6999 C7.5861,19.5279 6.2631,19.5479 5.4351,18.7449 C5.4191,18.7299 5.4051,18.7149 5.3901,18.6999 L5.3901,18.6099 Z" id="Stroke-13" stroke="#6FFADE" stroke-width="1.5"></path>
-                    <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-15" fill="#6FFADE"></path>
-                    <polygon id="Fill-17" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-const equipmentAlarmSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>hatplus</title>
-    <defs>
-        <linearGradient x1="100%" y1="100%" x2="20.318998%" y2="7.84095011e-14%" id="linearGradient-1">
-            <stop stop-color="#4BFFC8" offset="0%"></stop>
-            <stop stop-color="#45F2EC" offset="100%"></stop>
-        </linearGradient>
-    </defs>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-4设备管理" transform="translate(-998.000000, -254.000000)">
-            <g id="编组-16备份-8" transform="translate(974.000000, 230.000000)">
-                <g id="编组-6" transform="translate(24.000000, 24.000000)">
-                    <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
-                    <g id="异常" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
-                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="17" height="17"></rect>
-                        <path d="M9.00003613,1.00009438 C7.45266489,0.991339384 5.96400493,1.59197413 4.85604619,2.6721807 C3.77420104,3.74179852 3.16375561,5.19879645 3.16005953,6.72012488 L3.16005953,14.5280306 L14.7760126,14.5280306 L14.7760126,6.72010926 C14.7746725,5.19671341 14.1605756,3.73789487 13.0720104,2.67216507 C11.9832986,1.60721536 10.5229694,1.00760431 9.0000205,1.00009438 L9.00003613,1.00009438 Z M8.52003548,12.6560576 L8.35203526,8.87208057 L5.48804703,8.87208057 L9.24800521,4.12815624 L9.56800564,7.18412206 L12.2880093,7.28012148 L8.48800418,12.6560576 L8.52003548,12.6560576 Z M1.00003551,16.1280053 C0.997937773,15.8953576 1.08886376,15.671504 1.25262424,15.5062394 C1.41638472,15.3409748 1.63939864,15.2480106 1.87205781,15.2480106 L16.1280144,15.2480106 C16.3586463,15.2508825 16.5792874,15.3425823 16.7440153,15.5040247 C16.9059435,15.6716664 16.9975415,15.894943 17,16.1280053 C17,16.6095886 16.6096013,17 16.1280144,17 L1.87205781,17 C1.39047096,17 1.00003551,16.6095886 1.00003551,16.1280053 L1.00003551,16.1280053 Z" id="形状" fill="url(#linearGradient-1)"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-const equipmentOrderSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组</title>
-    <defs>
-        <polygon id="path-1" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
-        <polygon id="path-3" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
-    </defs>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-4设备管理" transform="translate(-1532.000000, -254.000000)">
-            <g id="编组-6" transform="translate(1508.000000, 230.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-3" fill="#6EF9E1"></path>
-                    <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-5" fill="#6EF9E1"></path>
-                    <g transform="translate(3.140000, 2.930055)">
-                        <mask id="mask-2" fill="white">
-                            <use xlink:href="#path-1"></use>
-                        </mask>
-                        <g id="Clip-8"></g>
-                        <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-7" fill="#6EF9E1" mask="url(#mask-2)"></path>
-                    </g>
-                    <g transform="translate(6.579800, 7.340500)">
-                        <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-9" fill="#6FFADE"></path>
-                        <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-11" fill="#6EF9E1"></path>
-                        <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-13" fill="#6EF9E1"></path>
-                        <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-15" fill="#6EF9E1"></path>
-                        <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-17" fill="#6DF8E1"></path>
-                        <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-19" fill="#6DF8E1"></path>
-                        <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-21" fill="#6DF8E1"></path>
-                    </g>
-                    <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-23" fill="#6EF9E1"></path>
-                    <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-25" fill="#6EF9E1"></path>
-                    <g transform="translate(3.140000, 2.930055)">
-                        <mask id="mask-4" fill="white">
-                            <use xlink:href="#path-3"></use>
-                        </mask>
-                        <g id="Clip-28"></g>
-                        <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-27" fill="#6EF9E1" mask="url(#mask-4)"></path>
-                    </g>
-                    <g transform="translate(6.579800, 7.340500)">
-                        <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-29" fill="#6FFADE"></path>
-                        <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-31" fill="#6EF9E1"></path>
-                        <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-33" fill="#6EF9E1"></path>
-                        <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-35" fill="#6EF9E1"></path>
-                        <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-37" fill="#6DF8E1"></path>
-                        <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-39" fill="#6DF8E1"></path>
-                        <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-41" fill="#6DF8E1"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-const equipmentAnalysisSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>analysis</title>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-4设备管理" transform="translate(-384.000000, -533.000000)">
-            <g id="编组-16备份-7" transform="translate(360.000000, 509.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-3" fill="#6FFADE"></path>
-                    <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-5" fill="#6FFADE"></path>
-                    <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-7" fill="#6FFADE"></path>
-                    <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-9" fill="#6FFADE"></path>
-                    <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-11" fill="#6FFADE"></path>
-                    <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-13" fill="#6FFADE"></path>
-                    <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-15" fill="#6FFADE"></path>
-                    <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-17" fill="#6FFADE"></path>
-                    <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-19" fill="#6FFADE"></path>
-                    <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-21" fill="#6FFADE"></path>
-                    <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-23" fill="#6FFADE"></path>
-                    <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-25" fill="#6FFADE"></path>
-                    <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-27" fill="#6FFADE"></path>
-                    <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-29" fill="#6FFADE"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
 export default {
   name: 'EquipmentManageHome',
   components: {
@@ -279,10 +163,6 @@ export default {
   props: {},
   data() {
     return {
-      equipmentExceptionSVG,
-      equipmentAlarmSVG,
-      equipmentOrderSVG,
-      equipmentAnalysisSVG,
       equipmentExceptionProps,
       equipmentExceptionDatalist,
       equipmentAlarmProps,
@@ -299,15 +179,7 @@ export default {
   computed: {
     ...mapGetters(['sidebar'])
   },
-  mounted() {
-    // window.addEventListener('resize', () => {
-    //   console.log('resizing....')
-    //   this.refreshSize++
-    //   this.$nextTick(() => {
-    //     this.$forceUpdate()
-    //   })
-    // }) // 不可行
-  },
+  mounted() {},
 
   methods: {
     changeFullScreen() {
@@ -325,6 +197,27 @@ export default {
 </script>
 
 <style scoped>
+::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
 .fix-table-eq-exception >>> .el-table td .cell {
   width: 80% !important;
   margin: auto;
@@ -338,8 +231,9 @@ export default {
 
 .visual-container {
   width: 100%;
-  min-width: 1280px;
-  /* height: calc(100vh - 128px); */
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
   background: url('./assets/bg.png') no-repeat;
   background-size: cover;
   overflow: hidden;
@@ -347,87 +241,127 @@ export default {
 }
 
 .techy-body {
-  height: calc(100vh - 64px);
+  flex: 1 0;
+  height: 65vh;
   width: 100%;
-  /* overflow: hidden; */
-  /* padding: 24px; */
-  padding: calc(100vw / 1920 * 24);
-  /* display: grid;
-  grid-template-columns: 3fr 1fr; */
+  padding: calc(24px * var(--beilv));
   display: flex;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
 }
 
 .tech-body__col-1 {
-  height: calc(100% - 28px);
-  flex: 1 3;
+  /* height: calc(100% - 28px); */
+  height: 100%;
+  flex: 1;
   display: flex;
   flex-direction: column;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
+  width: 70%;
 }
 
 .tech-body__col-2 {
-  flex: 1 1;
-  max-width: 25%;
-  height: calc(100% - 28px);
+  width: 25%;
+  flex: 0;
+  height: 100%;
 }
 
 .techy-container__inner {
   display: flex;
   flex-direction: column;
-  gap: 0.8vh;
+  gap: calc(8px * var(--beilv));
   height: calc(100% - 4vh);
   /* overflow-y: scroll; */
-  overflow-y: hidden;
+  overflow-y: auto;
 }
 .techy-container__inner > div {
   flex: 1 1;
 }
 
+.row-1,
+/* .row-2, */
+.row-3 {
+  height: 30%;
+}
+
 .row-1 {
   flex: 1;
   display: flex;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
+}
+
+.row-2 {
+  flex: 0;
+}
+
+.row-3 {
+  flex: 1;
 }
 
 .equipment-exception {
-  flex: 3 1;
+  min-width: 20%;
+  flex: 3;
 }
 
 .equipment-alarm {
-  flex: 2 1;
+  min-width: 20%;
+  flex: 2;
+}
+
+.table-wrapper {
+  height: calc(100% - 3vh);
+  overflow: auto;
 }
 
 .grid {
   display: grid;
 }
 
-.columns-2 {
-  grid-template-columns: 1fr 3fr;
-  /* gap: 8px; */
-  gap: 0.5vw;
+.equipment-analysis__inner {
+  height: calc(100% - 32px);
+  display: flex;
+  gap: calc(8px * var(--beilv));
+}
+
+.pl-jdl {
+  padding: calc(8px * var(--beilv)) calc(16px * var(--beilv));
+  height: calc(191px * var(--beilv));
+  width: calc(245px * var(--beilv));
+  display: flex;
+  flex-direction: column;
+}
+
+.pl-jdl__title {
+  font-size: calc(15px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+  color: #01cfcc;
+}
+
+.eqs-oee-mtbr-btbf {
+  flex: 1;
+  height: calc(191px * var(--beilv));
+  overflow: hidden;
+  overflow-y: auto;
 }
 
 .grid-2-3 {
   grid-template-columns: repeat(3, 1fr);
   grid-template-rows: 1fr 1fr;
-  /* gap: 4px; */
-  gap: 0.6vh 0.3vw;
+  gap: calc(8px * var(--beilv)) calc(4px * var(--beilv));
 }
 
 .product-line-selection {
   border: none;
   outline: none;
-  border-radius: 2px 4px 4px 2px;
+  border-radius: calc(4px * var(--beilv));
   background: #31878c45;
   /* opacity: 0.29; */
   color: white;
   position: absolute;
-  padding: 0.5vh;
-  width: 5vw;
-  font-size: 12px;
-  line-height: 18px;
-  top: calc(1vh + 8px);
-  left: calc(5vw + 32px);
+  padding: calc(4px * var(--beilv));
+  width: calc(114px * var(--beilv));
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+  top: calc(24px * var(--beilv));
+  left: calc(140px * var(--beilv));
 }
 </style>

src/views/EquipmentManager/components/EquipmentAnalysisBox.vue

@@ -52,12 +52,11 @@ const ProgreeBar = {
       'div',
       {
         style: {
-          height: '0.5vh',
+          height: '100%',
           width: '100%',
-          borderRadius: '8px',
+          borderRadius: 'calc(8px * var(--beilv))',
           position: 'relative',
           background: '#1E2D4590',
-          // background: 'red',
           overflow: 'hidden'
         }
       },
@@ -71,7 +70,7 @@ const ProgreeBar = {
               top: 0,
               width: this.process + '%',
               height: '100%',
-              borderRadius: '8px',
+              borderRadius: 'calc(8px * var(--beilv))',
               background: `linear-gradient(to right, ${this.colors[0]}, ${this.colors[1]})`
             }
           },
@@ -114,10 +113,10 @@ export default {
 }
 
 .equipment-analysis-box__title {
-  font-size: 1.25vh;
-  line-height: 2vh;
-  letter-spacing: 1px;
-  width: 3vw;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+  letter-spacing: calc(1px * var(--beilv));
+  width: 30%;
   overflow-wrap: break-word;
   align-self: center;
   text-align: center;
@@ -130,12 +129,9 @@ export default {
 .param-name {
   opacity: 70%;
   text-align: right;
-  /* font-size: 12px;
-  line-height: 14px;
-  width: 36px; */
-  font-size: 1vh;
-  line-height: 1.2;
-  width: 2vw;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  width: 20%;
 }
 .param-value {
   opacity: 70%;
@@ -143,20 +139,22 @@ export default {
   /* font-size: 12px;
   line-height: 14px;
   width: 24px; */
-  font-size: 1vh;
-  line-height: 1.2;
-  width: 1.5vw;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  width: 15%;
 }
 
 .param-list::before {
   content: '';
   position: absolute;
-  left: -11px;
-  top: 10%;
-  width: 1px;
-  /* height: 100%; */
-  height: 80%;
-  background: linear-gradient(to bottom, transparent, #ffffff8c, transparent);
+  left: calc(-10px * var(--beilv));
+  width: 2px;
+  height: 100%;
+  background: linear-gradient(to bottom, transparent, #455670, transparent);
+}
+
+.progress-bar {
+  height: calc(8px * var(--beilv));
 }
 
 .flex {

src/views/EquipmentManager/components/TechyAnalysisHeader.vue

@@ -125,7 +125,7 @@ export default {
 
 .techy-analysis-header__title {
   color: #01cfcc;
-  font-size: 1.25vh;
-  line-height: 18px;
+  font-size: calc(15px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
 }
 </style>

src/views/EquipmentManager/components/TechyBox.vue

@@ -11,10 +11,10 @@ export default {}
 <style scoped>
 .techy-box {
   background: transparent;
-  box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.2);
+  box-shadow: inset 0 0 calc(17px * var(--beilv)) 0 rgba(255, 255, 255, 0.2);
   display: inline-block;
   height: 100%;
   width: 100%;
-  border-radius: .25rem;
+  border-radius: calc(4px * var(--beilv));
 }
 </style>

src/views/EquipmentManager/components/TechyContainer.vue

@@ -12,7 +12,7 @@
     </template>
 
     <div class="container-title-wrapper">
-      <span class="container-icon" v-html="icon" />
+      <span class="container-icon" v-html="computeIcon" />
       <span class="container-title">{{ title }}</span>
     </div>
 
@@ -21,6 +21,8 @@
 </template>
 
 <script>
+import { IconBanshou, IconTrend, IconMenuChilun, IconSafetyHat } from './icons'
+
 export default {
   name: 'TechyContainer',
   props: {
@@ -34,21 +36,35 @@ export default {
   data() {
     return {}
   },
+  computed: {
+    computeIcon() {
+      switch (this.icon) {
+        case '扳手螺丝刀':
+          return IconBanshou
+        case '趋势搜索':
+          return IconTrend
+        case '清单齿轮':
+          return IconMenuChilun
+        case '安全帽':
+          return IconSafetyHat
+        // more...
+      }
+    }
+  },
   mounted() {}
 }
 </script>
 
 <style scoped>
 .techy-container {
-  border: 2px solid #52fff1;
+  border: calc(2px * var(--beilv)) solid #52fff1;
   border-image: linear-gradient(90deg, rgba(82, 255, 241, 0.6), rgba(95, 190, 249, 0), rgba(82, 255, 241, 0.6)) 2 2;
   display: inline-block;
   position: relative;
-  /* padding: 24px; */
-  padding: calc(100vw / 1920 * 22);
+  padding: calc(24px * var(--beilv));
   width: 100%;
   height: 100%;
-  box-shadow: inset 0px 0px 20px 0px rgba(255,255,255,0.15);
+  box-shadow: inset 0px 0px 20px 0px rgba(255, 255, 255, 0.15);
 }
 
 .line {
@@ -57,58 +73,47 @@ export default {
 }
 
 .horizontal {
-  /* height: 4px;
-  width: 24px; */
-  /* height: 0.325vh;
-  width: 3vh; */
-  height: calc(100vw / 1920 * 4);
-  width: calc(100vw / 1920 * 30);
+  height: calc(4px * var(--beilv));
+  width: calc(26px * var(--beilv));
 }
 
 .vertical {
-  /* height: 24px;
-  width: 4px; */
-  /* height: 3vh;
-  width: 0.325vh; */
-  height: calc(100vw / 1920 * 30);
-  width: calc(100vw / 1920 * 4);
+  height: calc(26px * var(--beilv));
+  width: calc(4px * var(--beilv));
 }
 
 .top {
-  top: -3px;
+  top: calc(-3px * var(--beilv));
 }
 
 .left {
-  left: -3px;
+  left: calc(-3px * var(--beilv));
 }
 
 .right {
-  right: -3px;
+  right: calc(-3px * var(--beilv));
 }
 
 .bottom {
-  bottom: -3px;
+  bottom: calc(-3px * var(--beilv));
 }
 
 .container-title-wrapper {
   color: #52fff1;
   display: flex;
   align-items: center;
-  /* font-size: 18px;
+  font-size: calc(18px * var(--beilv));
   line-height: 1;
-  height: 24px;
-  margin-bottom: 8px; */
-  /* font-size: 1.25vh;
-  line-height: 1;
-  height: 1.5vh;
-  margin-bottom: 1.25vh; */
-  font-size: calc((100vw / 1920) * 16);
-  line-height: 1;
-  height: calc((100vw / 1920) * 20);
-  margin-bottom: 1.25vh;
+  margin-bottom: calc(8px * var(--beilv));
 }
 
 .container-title {
-  margin-left: 4px;
+  margin-left: calc(4px * var(--beilv));
+}
+
+.container-icon {
+  position: relative;
+  height: calc(24px * var(--beilv)) !important;
+  width: calc(24px * var(--beilv)) !important;
 }
 </style>

src/views/EquipmentManager/components/TechyHeader.vue

@@ -1,17 +1,38 @@
 <template>
   <header class="techy-header">
-    <img class="logo-img" src="./logo.png" alt="cnbm">
-    <span style="display: line-block; margin-left: calc(100vw / 1920 * 8); letter-spacing: 3px;">{{ headTitle }}</span>
+    <div class="center-header">
+      <img class="logo-img" src="./logo.png" alt="cnbm">
+      <span class="techy-header__title">{{ headTitle }}</span>
+    </div>
 
-    <span class="fullscreen-btn" @click="handleClick('fullscreen')">
-      <span v-if="isFullScreen" v-html="unfullScreenSvg" />
-      <span v-else v-html="fullScreenSvg" />
-    </span>
+    <!-- <div class="date">2022.10.14</div>
+    <div class="time">20:12:24</div> -->
+
+    <div class="fullscreen-btn">
+      <!-- <span style="color: #52fff1; margin-right: 8px;" @click="handleClick('home')" v-html="homeSvg" /> -->
+      <span v-if="isFullScreen" @click="handleClick('fullscreen')" v-html="unfullScreenSvg" />
+      <span v-else @click="handleClick('fullscreen')" v-html="fullScreenSvg" />
+    </div>
   </header>
 </template>
 
 <script>
-const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+// const homeSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const homeSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>首页</title>
+    <g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="1大屏-数字工厂总览" transform="translate(-1824.000000, -46.000000)" fill-rule="nonzero">
+            <g id="首页" transform="translate(1824.000000, 46.000000)">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="32" height="32"></rect>
+                <path d="M3.36212554,9.99760304 L14.4561021,2.03491762 C15.37881,1.37257076 16.62119,1.37257076 17.5438979,2.03491762 L28.6378745,9.99760304 C29.7265595,10.7789878 30.3723957,12.0369335 30.3723957,13.3770071 L30.3723957,26.217608 C30.3723957,28.5153002 28.5096576,30.3780383 26.2119654,30.3780383 L5.78803465,30.3780383 C3.49034244,30.3780383 1.62760433,28.5153002 1.62760433,26.217608 L1.62760433,13.3773853 C1.62760433,12.0371783 2.27333209,10.7790656 3.36212554,9.99760304 Z M4.68552062,11.8410519 C4.19052975,12.196239 3.89692996,12.7681449 3.89692996,13.3773853 L3.89692996,26.217608 C3.89692996,27.2620363 4.74360637,28.1087127 5.78803465,28.1087127 L26.2119654,28.1087127 C27.2563936,28.1087127 28.10307,27.2620363 28.10307,26.217608 L28.10307,13.3773853 C28.10307,12.7681449 27.8094702,12.196239 27.3144794,11.8410519 L16.2205028,3.87836647 C16.0887105,3.78379718 15.9112895,3.78379718 15.7794972,3.87836647 L4.68552062,11.8414301 L4.68552062,11.8410519 Z" id="形状" fill="#42D0CE"></path>
+                <path d="M16.25,17 C16.8972087,17 17.4295339,17.4918747 17.4935464,18.1221948 L17.5,18.25 L17.5,28.25 C17.5,28.9403559 16.9403559,29.5 16.25,29.5 C15.6027913,29.5 15.0704661,29.0081253 15.0064536,28.3778052 L15,28.25 L15,18.25 C15,17.5596441 15.5596441,17 16.25,17 Z" id="路径-3" fill="#42D0CE"></path>
+            </g>
+        </g>
+    </g>
+</svg>`
+
+// const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const fullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组 54备份</title>
     <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <g id="2-4设备管理" transform="translate(-1864.000000, -162.000000)">
@@ -23,7 +44,8 @@ const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" versi
     </g>
 </svg>`
 
-const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+// const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const unfullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组 54备份 2</title>
     <g id="3WMS。1、2、3、4、5、6" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <g id="编组-54备份-2">
@@ -32,13 +54,13 @@ const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" ver
         </g>
     </g>
 </svg>`
-
 export default {
   name: 'TechyHeader',
   props: ['headTitle'],
   data() {
     return {
       fullScreenSvg,
+      homeSvg,
       unfullScreenSvg,
       isFullScreen: false
     }
@@ -48,6 +70,8 @@ export default {
       if (source === 'fullscreen') {
         this.isFullScreen = !this.isFullScreen
         this.$emit('toggle-full-screen', { full: this.isFullScreen })
+      } else if (source === 'home') {
+        this.$router.push('/')
       }
     }
   }
@@ -55,6 +79,16 @@ export default {
 </script>
 
 <style scoped>
+/* @font-face {
+  font-family: 'zcoolqingkehuangyouti';
+  src: url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff2') format('woff2'),
+      url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff') format('woff'),
+      url('./assets/fonts/zcoolqingkehuangyouti-Regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+} */
+
 .techy-header {
   background: transparent;
   display: flex;
@@ -63,30 +97,75 @@ export default {
   position: relative;
   color: white;
   /* font-size: 24px; */
-  font-size: 2vh;
-  padding: calc(100vw / 1920 * 16) 0;
+  padding: calc(24px * var(--beilv)) 0;
   line-height: 1;
   background: url(./header-new.png) no-repeat;
   /** 背景图片好像左右不对称 : */
   /* background-position: bottom left 40px;  */
   /* background-size: cover; */
   background-size: 100% 100%;
-  background-position: bottom left calc(100vw / 1920 * 40);
-  height: calc(100vw / 1920 * 80);
+  background-position: bottom;
+  /* background-position: bottom left calc(32px * var(--beilv)); */
+  height: calc(96px * var(--beilv));
+}
+
+.center-header {
+  /* transform: translateX(calc(-18px * var(--beilv))); */
+  transform: translateX(-8%) translateY(18%);
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .logo-img {
-  width: calc(100vw / 1920 * 24);
+  width: calc(28px * var(--beilv));
+}
+
+.techy-header__title {
+  display: line-block;
+  margin-left: calc(12px * var(--beilv));
+  /* font-size: 29px; */
+  font-size: calc(29px * var(--beilv));
+  line-height: calc(41px * var(--beilv));
+  letter-spacing: calc(2.23px * var(--beilv));
+  text-shadow: 0px 0px calc(11px * var(--beilv)) rgba(221, 237, 255, 0.34);
+}
+
+.date,
+.time {
+  /* font-family: zcoolqingkehuangyouti, sans-serif; */
+  font-size: calc(100vmin / 1920 * 42);
+  line-height: 1.5;
+  /* font-size: 28px;
+  line-height: 36px; */
+  color: #49e1de;
+  letter-spacing: 0.8px;
+  position: absolute;
+  bottom: calc(100vmin / 1920 * 14);
+}
+
+.date {
+  /* left: 72px; */
+  left: calc(100vmin / 1920 * 72);
+}
+
+.time {
+  /* right: 128px; */
+  right: calc(100vmin / 1920 * 186);
 }
 
 .fullscreen-btn {
-  width: 32px;
-  height: 32px;
   cursor: pointer;
   position: absolute;
-  /* right: 24px;  */
   /** techy-body 的内部 padding 值 */
-  right: calc(100vw / 1920 * 24);
+  right: calc(24px * var(--beilv));
+  top: calc(44px * var(--beilv));
   bottom: 0;
 }
+
+.fullscreen-btn > span {
+  display: inline-block;
+  width: calc(32px * var(--beilv));
+  height: calc(32px * var(--beilv));
+}
 </style>

src/views/EquipmentManager/components/TechyTable.vue

@@ -7,27 +7,7 @@
 -->
 <template>
   <div class="visual-base-table-container">
-    <el-table
-      v-loading="isLoading"
-      :header-cell-style="{
-        background: 'rgba(79,114,136,0.29)',
-        color: '#fff',
-        height: 'calc(100vh / 1920 * 48)',
-        lineHeight: 'calc(100vh / 1920 * 48)',
-        padding: 0,
-        fontSize: 'calc(100vh / 1920 * 20)'
-      }"
-      :row-style="setRowStyle"
-      :data="renderData"
-      border
-      style="width: 100%; background: transparent"
-      :cell-style="{
-        height: 'calc(100vh / 1920 * 48)',
-        lineHeight: 'calc(100vh / 1920 * 48)',
-        padding: 0,
-        fontSize: 'calc(100vh / 1920 * 20)'
-      }"
-    >
+    <el-table v-loading="isLoading" class="techy-el-table" :data="renderData" border height="100%">
       <el-table-column
         v-if="page && limit && showIndex"
         prop="_pageIndex"
@@ -130,84 +110,102 @@ export default {
   methods: {
     emitData(val) {
       this.$emit('emitFun', val)
-    },
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(76,97,123,0.2)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      } else {
-        return {
-          background: 'rgba(79,114,136,0.29)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      }
-    },
-    setCellStyle(v) {
-      return {
-        lineHeight: 23 * this.beilv + 'px'
-      }
     }
   }
 }
 </script>
-<style lang="scss">
-@import '~@/styles/index.scss';
+
+<style scoped>
+.visual-base-table-container >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));;
+  height: calc(8px * var(--beilv));;
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));;
+  background: #5bc4bf9f;
+}
+
+/* .visual-base-table-container {
+  min-width: 30vw;
+} */
 .visual-base-table-container {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,
-  .el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,
-  td {
-    border-color: #0d1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79, 114, 136, 0.29) !important;
-  }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79, 114, 136, 0.29) !important;
-  }
-}
-.setting {
-  text-align: right;
-  padding: 15px;
-  .setting-box {
-    width: 100px;
-  }
-  i {
-    color: #aaa;
-    @extend .pointer;
-  }
-}
-.p-0 {
-  padding: 0;
-}
-
-.p-0 >>> .cell {
   height: 100%;
-  margin: 0;
+}
+/* .visual-base-table-container >>> .el-table {
+  min-width: 120%;
+} */
+/* 清除默认样式 */
+.visual-base-table-container >>> th.gutter {
+  display: none;
+}
+.visual-base-table-container >>> table {
+  background: transparent;
+}
+
+.visual-base-table-container >>> .el-table,
+.visual-base-table-container >>> th,
+.visual-base-table-container >>> tr {
+  background: unset;
+}
+
+/* 设置设计稿样式 */
+.visual-base-table-container >>> .el-table::before,
+.visual-base-table-container >>> .el-table--group::after,
+.visual-base-table-container >>> .el-table--border::after,
+.visual-base-table-container >>> .el-table--border::after {
+  background: unset;
+}
+
+.visual-base-table-container >>> table * {
+  border-color: #0d1728;
+  border-width: calc(1px * var(--beilv));
+}
+
+.visual-base-table-container >>> td {
+  padding: calc(5px * var(--beilv));
+}
+
+.visual-base-table-container >>> td span {
+  color: #ffffffb3;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+}
+
+.visual-base-table-container >>> thead th {
   padding: 0;
 }
 
-.font-and-height {
-  font-size: calc(100vh / 1920 * 32);
+.visual-base-table-container >>> thead th .cell {
+  color: #fff;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  padding: calc(6px * var(--beilv));
+  white-space: nowrap;
+}
+
+.visual-base-table-container >>> .el-table__body tr:hover > td {
+  background-color: #42537130;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(odd) {
+  background-color: #0e203e;
+  /* background-color: #0e203e; */
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(even),
+.visual-base-table-container >>> .el-table thead {
+  background-color: #203760;
 }
 </style>

src/views/EquipmentManager/components/TechyVerticalTable.vue

@@ -40,13 +40,12 @@ export default {
 
 <style scoped>
 .techy-vertical-table {
-  height: calc(100% - 2.5vh);
-  overflow: hidden;
+  /* height: calc(100% - 2.5vh); */
+  overflow: auto;
   color: white;
 }
 
 .trow {
-  /* height: calc(100% / 6); */
   width: 100%;
   white-space: nowrap;
   display: flex;
@@ -57,37 +56,30 @@ export default {
 
 .thead,
 .tbody {
-  min-width: calc(100vw / 1920 * 96);
+  /* min-width: calc(100vw / 1920 * 96); */
   background-color: #20376080;
-  /* background-color: red; */
-  /* height: 100%; */
   white-space: nowrap;
   overflow: hidden;
   margin-right: 1px;
-  text-align: center;
+  text-align: left;
+  padding-left: calc(12px * var(--beilv));
+  padding-right: calc(12px * var(--beilv));
   font-weight: 400;
+  flex: 0 1 calc(100vw / 1920 * 96);
+  text-overflow: ellipsis;
 }
 
 .thead {
   width: 25%;
-  font-size: 14px;
-  line-height: 1.81;
-  /* padding: 8px 16px; */
-  /* font-size: 1vh; */
-  /* line-height: 2; */
-  /* font-weight: 400; */
+  font-size: calc(14px * var(--beilv));
+  line-height: 1.8;
 }
 
 .tbody {
   width: 24%;
   color: rgba(255, 255, 255, 0.7);
-  font-size: 12px;
+  font-size: calc(12px * var(--beilv));
   line-height: 2;
-  /* padding: 8px 12px; */
-  /* padding-left: 8px; */
-  /* font-size: 1vh; */
-  /* line-height: 2; */
-  /* font-weight: 400; */
 }
 
 .tbody:last-child {

src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue

@@ -34,7 +34,7 @@ export default {
             },
             axisLine: {
               lineStyle: {
-                color: '#ffffff3d'
+                color: '#5982B233'
               }
             },
             axisLabel: {
@@ -47,17 +47,18 @@ export default {
             type: 'value',
             splitLine: {
               lineStyle: {
-                color: '#ffffff3d'
+                color: '#5982B233'
               }
             },
             axisLine: {
               lineStyle: {
-                color: '#ffffff3d'
+                color: '#5982B233'
               }
             },
             axisLabel: {
               color: '#ffffff9d'
-            }
+            },
+            axisTick: { show : false }
           }
         ],
         series: [

src/views/EquipmentManager/components/icons.js

@@ -0,0 +1,394 @@
+// 扳手
+export const IconBanshou = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>setting tools</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M5.8599,18.0898 C6.4089,18.6418 7.3019,18.6448 7.8539,18.0958 C7.8559,18.0938 7.8579,18.0918 7.8599,18.0898 L14.5199,11.4298 L14.8899,11.4998 L15.0599,11.4998 C16.6169,11.7418 18.1089,10.7848 18.5399,9.2698 L18.2299,9.6198 C17.1349,10.6718 15.4049,10.6718 14.3099,9.6198 C13.2319,8.5358 13.2319,6.7838 14.3099,5.6998 L14.5999,5.4098 C13.0609,5.8908 12.1389,7.4618 12.4699,9.0398 L12.5499,9.4098 L5.8809,16.0798 C5.6139,16.3438 5.4659,16.7048 5.46982098,17.0798 C5.4729,17.4538 5.6199,17.8118 5.8809,18.0798 L5.8599,18.0898 Z M6.8599,19.8698 C6.1109,19.8828 5.3889,19.5898 4.8599,19.0598 C3.7809,17.9838 3.7769,16.2358 4.8529,15.1568 C4.8559,15.1538 4.8579,15.1518 4.8599,15.1498 L11.0099,8.9898 C10.7039,6.6548 12.2459,4.4768 14.5499,3.9898 L14.7799,3.9398 L15.0899,3.9398 C15.6049,3.8968 16.0939,4.1748 16.3199,4.6398 C16.4859,5.0968 16.3549,5.6088 15.9899,5.9298 L15.2299,6.6898 C14.6769,7.2388 14.6749,8.1318 15.2239,8.6838 L15.2299,8.6898 C15.7859,9.2338 16.6739,9.2338 17.2299,8.6898 L17.9899,7.9198 C18.2099,7.6868 18.5099,7.5478 18.8299,7.5298 C19.1509,7.5208 19.4599,7.6568 19.6709,7.8998 C19.9429,8.2518 20.0459,8.7058 19.9499,9.1398 C19.5749,11.5408 17.3609,13.2088 14.9499,12.9098 L8.7999,19.0598 C8.2859,19.5748 7.5889,19.8668 6.8599,19.8698 L6.8599,19.8698 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-7" fill="#6FFADE"></path>
+                <polygon id="Fill-9" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+                <path d="M5.3901,18.6099 C4.5621,17.8059 4.5411,16.4829 5.3451,15.6549 C5.3601,15.6399 5.3741,15.6249 5.3901,15.6099 L11.7891,9.2099 C11.3521,7.1479 12.6671,5.1199 14.7301,4.6799 L14.9301,4.6799 L15.1501,4.6799 C15.7401,4.6799 15.9301,5.1099 15.5501,5.4899 L14.7891,6.2499 C13.9611,7.0789 13.9611,8.4219 14.7891,9.2499 C15.6191,10.0789 16.9611,10.0789 17.7891,9.2499 L18.5501,8.4899 C18.6531,8.3769 18.7971,8.3079 18.9501,8.2999 C19.2201,8.2999 19.4301,8.5999 19.3501,9.1099 C19.0271,11.1909 17.0811,12.6169 15.0001,12.2999 L14.7901,12.2999 L8.3901,18.6999 C7.5861,19.5279 6.2631,19.5479 5.4351,18.7449 C5.4191,18.7299 5.4051,18.7149 5.3901,18.6999 L5.3901,18.6099 Z" id="Stroke-13" stroke="#6FFADE" stroke-width="1.5"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-15" fill="#6FFADE"></path>
+                <polygon id="Fill-17" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 趋势+放大镜
+export const IconTrend = `<svg  width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>analysis</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -533.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 509.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-25" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-27" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-29" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+齿轮
+export const IconMenuChilun = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+    <polygon id="path-3" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-1532.000000, -254.000000)">
+        <g id="编组-6" transform="translate(1508.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-5" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-8"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-7" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-9" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-11" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-13" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-15" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-17" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-19" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-21" fill="#6DF8E1"></path>
+                </g>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-23" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-25" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-28"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-27" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-29" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-31" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-33" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-35" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-37" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-39" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-41" fill="#6DF8E1"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 闪电安全帽
+export const IconSafetyHat = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>hatplus</title>
+<defs>
+    <linearGradient x1="100%" y1="100%" x2="20.318998%" y2="7.84095011e-14%" id="linearGradient-1">
+        <stop stop-color="#4BFFC8" offset="0%"></stop>
+        <stop stop-color="#45F2EC" offset="100%"></stop>
+    </linearGradient>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-998.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(974.000000, 230.000000)">
+            <g id="编组-6" transform="translate(24.000000, 24.000000)">
+                <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+                <g id="异常" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="17" height="17"></rect>
+                    <path d="M9.00003613,1.00009438 C7.45266489,0.991339384 5.96400493,1.59197413 4.85604619,2.6721807 C3.77420104,3.74179852 3.16375561,5.19879645 3.16005953,6.72012488 L3.16005953,14.5280306 L14.7760126,14.5280306 L14.7760126,6.72010926 C14.7746725,5.19671341 14.1605756,3.73789487 13.0720104,2.67216507 C11.9832986,1.60721536 10.5229694,1.00760431 9.0000205,1.00009438 L9.00003613,1.00009438 Z M8.52003548,12.6560576 L8.35203526,8.87208057 L5.48804703,8.87208057 L9.24800521,4.12815624 L9.56800564,7.18412206 L12.2880093,7.28012148 L8.48800418,12.6560576 L8.52003548,12.6560576 Z M1.00003551,16.1280053 C0.997937773,15.8953576 1.08886376,15.671504 1.25262424,15.5062394 C1.41638472,15.3409748 1.63939864,15.2480106 1.87205781,15.2480106 L16.1280144,15.2480106 C16.3586463,15.2508825 16.5792874,15.3425823 16.7440153,15.5040247 C16.9059435,15.6716664 16.9975415,15.894943 17,16.1280053 C17,16.6095886 16.6096013,17 16.1280144,17 L1.87205781,17 C1.39047096,17 1.00003551,16.6095886 1.00003551,16.1280053 L1.00003551,16.1280053 Z" id="形状" fill="url(#linearGradient-1)"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality = `<svg width="100%" height="100%"  viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量上报</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M15.8982,17.8 L15.8982,20.15 C15.8622,20.495 16.1052,20.809 16.4482,20.86 L22.2982,20.86 C22.6462,20.814 22.8942,20.499 22.8582,20.15 L22.8582,17.73 C22.8582,17.56 22.7482,17.42 22.6282,17.42 C22.4772,17.441 22.3702,17.578 22.3882,17.73 L22.3882,20.24 L16.3882,20.24 L16.3882,17.72 C16.3882,17.56 16.2782,17.43 16.1582,17.43 C16.0382,17.43 15.9382,17.56 15.9282,17.72 L15.8982,17.8 Z M22.2982,21.04 L16.4582,21.04 C16.0112,20.992 15.6832,20.598 15.7182,20.15 L15.7182,17.67 C15.7192,17.449 15.8992,17.271 16.1202,17.2729833 C16.3392,17.274 16.5172,17.45 16.5182,17.67 L16.5182,20.1 L22.1782,20.1 L22.1782,17.78 C22.1422,17.551 22.2992,17.336 22.5282,17.3 C22.7572,17.265 22.9722,17.421 23.0082,17.651 C23.0152,17.694 23.0152,17.738 23.0082,17.78 L23.0082,20.2 C23.0182,20.619 22.7132,20.98 22.2982,21.04 L22.2982,21.04 Z" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Stroke-15" stroke="#6EF9E1" stroke-width="0.2"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M12.2967,6.8498 L11.9997,12.7348 C11.9267,13.1178 11.5587,13.3688 11.1757,13.2948 C10.8917,13.2418 10.6697,13.0188 10.6147,12.7348 L10.3057,6.8498 L10.3057,6.7878 C10.3937,6.2348 10.9127,5.8568 11.4647,5.9438 C11.8997,6.0118 12.2407,6.3528 12.3087,6.7878 C12.3137,6.8078 12.3137,6.8288 12.3087,6.8498 L12.2967,6.8498 Z M11.3077,15.4668 C10.9047,15.4878 10.5627,15.1778 10.5417,14.7758 C10.5217,14.3728 10.8317,14.0308 11.2337,14.0098 C11.6357,13.9898 11.9787,14.2988 11.9987,14.7018 C11.9997,14.7178 12.0007,14.7338 11.9997,14.7498 C12.0067,15.1388 11.6967,15.4598 11.3077,15.4668 Z" id="Fill-19" fill="#6EF9E1"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-23" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality2 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量异常报警</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality3 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量缺陷分析</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 折角的菜单图标
+export const IconMenu1 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-1040.000000, -253.000000)">
+        <g id="编组-16备份-6" transform="translate(1016.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M16.3899,8.0902 C16.3899,8.5802 16.1899,8.8202 15.7999,8.8202 L10.0999,8.8202 C9.6999,8.8202 9.5099,8.5802 9.5099,8.0902 C9.5099,7.6002 9.6999,7.3702 10.0999,7.3702 L15.7999,7.3702 C16.1899,7.3702 16.3899,7.6102 16.3899,8.0902" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M14.51,11.95 C14.51,12.43 14.31,12.68 13.91,12.68 L10.11,12.68 C9.71,12.68 9.51,12.43 9.51,11.95 C9.51,11.47 9.71,11.23 10.11,11.23 L13.91,11.23 C14.31,11.23 14.51,11.47 14.51,11.95" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M12.5701,15.7801 C12.5701,16.2601 12.3701,16.5001 11.9601,16.5001 L10.1201,16.5001 C9.7101,16.5001 9.5101,16.2601 9.5101,15.7801 C9.5101,15.3001 9.7101,15.0601 10.1201,15.0601 L11.9601,15.0601 C12.3701,15.0601 12.5701,15.3001 12.5701,15.7801" id="Fill-7" fill="#6EF9E1"></path>
+                <path d="M8.0398,7.39 L8.0398,7.39 C8.4378,7.39 8.7598,7.712 8.7598,8.11 C8.7598,8.508 8.4378,8.83 8.0398,8.83 C7.6428,8.83 7.3198,8.508 7.3198,8.11 C7.3198,7.712 7.6428,7.39 8.0398,7.39" id="Fill-9" fill="#6DF8E1"></path>
+                <path d="M8.0398,11.2699 L8.0398,11.2699 C8.4378,11.2699 8.7598,11.5919 8.7598,11.9899 C8.7598,12.3879 8.4378,12.7099 8.0398,12.7099 C7.6428,12.7099 7.3198,12.3879 7.3198,11.9899 C7.3198,11.5919 7.6428,11.2699 8.0398,11.2699" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M8.0398,15.1502 L8.0398,15.1502 C8.4378,15.1502 8.7598,15.4722 8.7598,15.8702 C8.7598,16.2672 8.4378,16.5902 8.0398,16.5902 C7.6428,16.5902 7.3198,16.2672 7.3198,15.8702 C7.3198,15.4722 7.6428,15.1502 8.0398,15.1502" id="Fill-13" fill="#6DF8E1"></path>
+                <path d="M15.5501,19.7801 L15.5501,16.7801 L18.3401,16.7801 L15.5501,19.7801 Z M19.2201,9.6501 C18.7891,9.6501 18.4401,9.9991 18.4401,10.4301 C18.4401,10.4331 18.4401,10.4371 18.4401,10.4401 L18.4401,15.1501 L14.3801,15.1501 C14.1571,15.1551 13.9801,15.3371 13.9801,15.5601 L13.9801,20.0301 L6.6901,19.9601 C6.0901,19.9601 5.5901,19.1201 5.5901,18.5001 L5.5901,5.7801 C5.5901,5.1711 6.0811,4.6761 6.6901,4.6701 L17.3401,4.6701 C17.9491,4.6761 18.4401,5.1711 18.4401,5.7801 L18.4401,7.7801 C18.4411,8.2111 18.7911,8.5591 19.2211,8.5581 C19.6511,8.5581 19.9991,8.2101 20.0001,7.7801 L20.0001,4.7801 C19.9731,3.9181 19.2721,3.2301 18.4101,3.2201 L5.5001,3.2201 C4.6551,3.2251 3.9741,3.9151 3.98006066,4.7601 L4.0501,20.0901 C4.0441,20.9351 4.7251,21.6241 5.5701,21.6301 L14.8101,21.6301 L14.8701,21.6301 L14.9301,21.6301 L19.7401,17.0401 C19.8511,16.9251 19.9121,16.7701 19.9101,16.6101 L19.9101,10.6601 C20.0331,10.2411 19.7941,9.8021 19.3751,9.6791 C19.3241,9.6641 19.2731,9.6551 19.2201,9.6501 L19.2201,9.6501 Z" id="Fill-15" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+放大镜
+export const IconMenuSearch = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+安全帽
+export const IconPCAlert = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+三横
+export const IconPCTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -872.000000)">
+        <g id="编组-17备份" transform="translate(24.000000, 856.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M21.3174,18.5158014 L16.0874,18.5158014 C16.0584,18.5008014 16.0254,18.5008014 15.9974,18.5158014 C15.7554,18.6438014 15.6104,18.9018014 15.6274,19.1748014 C15.6274,19.5658014 15.8574,19.8748014 16.1364,19.8748014 L21.3174,19.8748014 C21.6074,19.8748014 21.8274,19.5658014 21.8274,19.1748014 C21.8274,18.7858014 21.6274,18.5158014 21.3174,18.5158014" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M21.3174,15.9564014 L16.0874,15.9564014 C16.0584,15.9414014 16.0254,15.9414014 15.9974,15.9564014 C15.7554,16.0844014 15.6104,16.3424014 15.6274,16.6154014 C15.6274,17.0064014 15.8574,17.3154014 16.1364,17.3154014 L21.3174,17.3154014 C21.6074,17.3154014 21.8274,17.0064014 21.8274,16.6154014 C21.8274,16.2264014 21.6274,15.9564014 21.3174,15.9564014" id="Fill-19备份" fill="#6FFADE"></path>
+                <path d="M21.3174,13.3970014 L16.0874,13.3970014 C16.0584,13.3820014 16.0254,13.3820014 15.9974,13.3970014 C15.7554,13.5250014 15.6104,13.7830014 15.6274,14.0560014 C15.6274,14.4470014 15.8574,14.7560014 16.1364,14.7560014 L21.3174,14.7560014 C21.6074,14.7560014 21.8274,14.4470014 21.8274,14.0560014 C21.8274,13.6670014 21.6274,13.3970014 21.3174,13.3970014" id="Fill-19备份-2" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 三个菱形叠加
+export const IconTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>物料信息 </title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -392.000000)" fill-rule="nonzero">
+        <g id="物料信息-" transform="translate(48.000000, 392.000000)">
+            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M20.3505422,14.9151538 L20.458789,14.9215423 C20.8283324,15.1756033 20.9365283,16.0632505 20.5345696,16.3962497 L20.4405365,16.4586841 L12.3478497,20.7032297 C12.2016803,20.79009 11.8833705,20.8006382 11.6976954,20.7375186 L11.6173217,20.699832 L3.53524588,16.5181762 C3.13421554,16.2396631 3.13620989,15.4741677 3.38080569,15.0736815 L3.44148439,14.9881289 L3.57039169,14.9618461 L11.9916374,19.3126195 L20.3505422,14.9151538 Z M20.3505455,11.1907368 L20.4587026,11.1970677 C20.8283142,11.4506321 20.936545,12.3384142 20.5345732,12.6714428 L20.4405365,12.7338816 L12.3478497,16.9784271 C12.2016803,17.0652875 11.8833705,17.0758357 11.6976954,17.012716 L11.6173217,16.9750295 L3.53524588,12.7933736 C3.13421554,12.5148606 3.13620989,11.7493651 3.38080569,11.348879 L3.44148439,11.2633264 L3.57039169,11.2370435 L11.9916374,15.5876251 L20.3505455,11.1907368 Z M12.4463389,3.3309719 L12.5600247,3.40332636 L20.3179067,7.46797471 C20.3828378,7.50198626 20.4422319,7.54565391 20.4941486,7.59757438 C20.8671243,7.97146203 20.8671243,8.57668705 20.4940313,8.95069207 L20.4111763,9.02185105 L20.3185938,9.07973137 L12.5536247,13.1569789 C12.2525083,13.3810327 11.8526139,13.4065554 11.5389056,13.2394459 L11.4256662,13.1677617 L3.66901765,9.16124436 C3.60269972,9.12706228 3.54205927,9.0828421 3.48915918,9.0300661 C3.30967167,8.85060515 3.20883441,8.60718793 3.20883441,8.35337304 C3.20883441,8.09955815 3.30967167,7.85614093 3.48911133,7.67672785 L3.57020807,7.60674321 L3.66079174,7.54945114 L11.4274137,3.41400371 C11.7293235,3.18803429 12.1313281,3.16229769 12.4463389,3.3309719 Z M12.0031732,4.74717805 L5.24637717,8.34632811 L11.9321821,11.8491065 L18.7348003,8.27501628 L12.0031732,4.74717805 Z" id="形状结合" stroke="#6EF9E1" stroke-width="0.2" fill="#77FFF2"></path>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单 only
+export const IconMenuOnly = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>菜单</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-384.000000, -253.000000)">
+        <g id="编组-16备份-5" transform="translate(360.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#CAE5DD" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.0901,3.8098 L16.6101,3.8098 L16.6101,4.7298 L18.0901,4.7298 C18.5481,4.7298 18.9201,5.1018 18.9201,5.5598 L18.9201,19.0898 C18.9201,19.5488 18.5481,19.9198 18.0901,19.9198 L5.9501,19.9198 C5.4911,19.9198 5.1201,19.5488 5.1201,19.0898 L5.1201,5.5598 C5.1201,5.1018 5.4911,4.7298 5.9501,4.7298 L7.6501,4.7298 L7.6501,3.8098 L5.9501,3.8098 C4.9861,3.8158 4.2051,4.5958 4.2001,5.5598 L4.2001,19.0898 C4.2051,20.0538 4.9861,20.8348 5.9501,20.8398 L18.1001,20.8398 C19.0641,20.8348 19.8441,20.0538 19.8501,19.0898 L19.8501,5.5598 C19.8441,4.5918 19.0581,3.8098 18.0901,3.8098" id="Fill-3" fill="#6EF9DE"></path>
+                <path d="M5.95,4.1702 C5.182,4.1702 4.56,4.7922 4.56,5.5602 L4.56,19.0902 C4.56,19.8582 5.182,20.4802 5.95,20.4802 L18.1,20.4802 C18.867,20.4802 19.49,19.8582 19.49,19.0902 L19.49,5.5602 C19.49,4.7922 18.867,4.1702 18.1,4.1702 L16.95,4.1702 L16.95,4.3402 L18.07,4.3402 C18.721,4.3402 19.25,4.8682 19.25,5.5202 L19.25,19.0502 C19.25,19.7012 18.721,20.2302 18.07,20.2302 L5.95,20.2302 C5.298,20.2302 4.77,19.7012 4.77,19.0502 L4.77,5.5602 C4.748,4.9082 5.258,4.3622 5.909,4.3402 C5.923,4.3402 5.936,4.3402 5.95,4.3402 L7.3,4.3402 L7.3,4.1302 L5.95,4.1702 Z M18.62,21.1902 L5.41,21.1902 C4.543,21.1902 3.84,20.4872 3.84,19.6202 L3.84,5.0302 C3.84,4.1632 4.543,3.4602 5.41,3.4602 L8,3.4602 L8,5.0902 L6.61,5.0902 C5.98,5.0902 5.47,5.6002 5.47,6.2302 L5.47,18.4202 C5.47,19.0492 5.98,19.5602 6.61,19.5602 L17.42,19.5602 C18.05,19.5602 18.56,19.0492 18.56,18.4202 L18.56,6.2302 C18.56,5.6002 18.05,5.0902 17.42,5.0902 L16.26,5.0902 L16.26,3.4602 L18.62,3.4602 C19.487,3.4602 20.19,4.1632 20.19,5.0302 L20.19,19.6202 C20.19,20.4872 19.487,21.1902 18.62,21.1902 L18.62,21.1902 Z" id="Fill-5" fill="#6EF9DE"></path>
+                <path d="M8.5101,2.5398 L15.6801,2.5398 C16.3151,2.5398 16.8301,3.0548 16.8301,3.6898 L16.8301,4.6398 C16.8301,5.2748 16.3151,5.7898 15.6801,5.7898 L8.5101,5.7898 C7.8751,5.7898 7.3601,5.2748 7.3601,4.6398 L7.3601,3.6898 C7.3601,3.0548 7.8751,2.5398 8.5101,2.5398" id="Fill-7" fill="#6EF9DE"></path>
+                <path d="M16.3299,8.5398 C16.3299,9.0398 16.1299,9.2898 15.7199,9.2898 L9.8299,9.2898 C9.4299,9.2898 9.2199,9.0398 9.2199,8.5398 C9.2199,8.0398 9.4299,7.7998 9.8299,7.7998 L15.7199,7.7998 C16.1299,7.7998 16.3299,8.0498 16.3299,8.5398" id="Fill-9" fill="#6EF9E1"></path>
+                <path d="M7.7,7.8098 L7.71,7.8098 C8.118,7.8098 8.45,8.1418 8.45,8.5498 L8.45,8.5598 C8.45,8.9688 8.118,9.2998 7.71,9.2998 L7.7,9.2998 C7.291,9.2998 6.96,8.9688 6.96,8.5598 L6.96,8.5498 C6.96,8.1418 7.291,7.8098 7.7,7.8098" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M16.3299,12.2698 C16.3299,12.7698 16.0499,13.0198 15.4799,13.0198 L10.0799,13.0198 C9.5099,13.0198 9.2199,12.7698 9.2199,12.2698 C9.2199,11.7698 9.5099,11.5198 10.0799,11.5198 L15.4799,11.5198 C16.0499,11.5198 16.3299,11.7698 16.3299,12.2698" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M7.7,11.5598 L7.71,11.5598 C8.118,11.5598 8.45,11.8918 8.45,12.2998 L8.45,12.3098 C8.45,12.7188 8.118,13.0498 7.71,13.0498 L7.7,13.0498 C7.291,13.0498 6.96,12.7188 6.96,12.3098 L6.96,12.2998 C6.96,11.8918 7.291,11.5598 7.7,11.5598" id="Fill-15" fill="#6DF8E1"></path>
+                <path d="M16.3299,16.0198 C16.3299,16.5198 16.1299,16.7698 15.7199,16.7698 L9.8299,16.7698 C9.4299,16.7698 9.2199,16.5198 9.2199,16.0198 C9.2199,15.5198 9.4299,15.2698 9.8299,15.2698 L15.7199,15.2698 C16.1299,15.2698 16.3299,15.5198 16.3299,16.0198" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M7.7,15.2898 L7.71,15.2898 C8.118,15.2898 8.45,15.6218 8.45,16.0298 L8.45,16.0398 C8.45,16.4488 8.118,16.7798 7.71,16.7798 L7.7,16.7798 C7.291,16.7798 6.96,16.4488 6.96,16.0398 L6.96,16.0298 C6.96,15.6218 7.291,15.2898 7.7,15.2898" id="Fill-19" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// TODO 放到 tech-container 里
+// let icon = '' 
+// switch (icon) {
+//     case 'menuIcon': return IconMenuOnly;
+//     case 'stackIcon': return IconTriple;
+//     case 'zhejiaoMenuListIcon': return IconMenu1;
+//     case 'trendAnalysisIcon': return IconTrend;
+//     case 'alertMenuIcon': return IconPCTriple;
+//     case 'lightHatIcon': return IconSafetyHat;
+//     case 'menuAnalysisIcon': return IconMenuSearch;
+//     case 'alertWarningIcon': return IconPCAlert;
+// }

src/views/EquipmentManager/mockData.js

@@ -33,23 +33,28 @@ const PriorityComponent = {
 }
 
 export const equipmentExceptionProps = [
-  { label: '设备名称', prop: 'eqName', align: 'center' },
-  { label: '所属产线', prop: 'pl', align: 'center', width: 80 },
-  { label: '报修/异常内容', prop: 'content', align: 'center' },
-  { label: '报修/发现人', prop: 'creator', align: 'center', width: 100 },
-  { label: '时间', prop: 'time', align: 'center' },
-  { label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, width: 80 }
+  { label: '设备名称', prop: 'eqName', align: 'center', 'min-width': 60 },
+  { label: '所属产线', prop: 'pl', align: 'center', 'min-width': 60 },
+  { label: '报修/异常内容', prop: 'content', align: 'center', 'min-width': 80 },
+  { label: '报修/发现人', prop: 'creator', align: 'center', width: 110 },
+  { label: '时间', prop: 'time', align: 'center', 'min-width': 80 },
+  { label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, 'min-width': 60 }
 ]
 
 export const equipmentExceptionDatalist = [
   { 'eqName': 'A1一次固化机', 'pl': 'E线', 'content': '开化是专品直', 'creator': '郭娜', 'time': '1997-06-08 06:14:37', 'priority': 1 },
   { 'eqName': 'B1一次冷却机', 'pl': 'B线', 'content': '书记因地观同展土军信', 'creator': '薛洋', 'time': '2006-03-15 10:39:30', 'priority': 2 },
   { 'eqName': 'A1预热机', 'pl': 'D线', 'content': '说资把话', 'creator': '曾刚', 'time': '1985-01-29 23:21:53', 'priority': 3 },
-  { 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 5 },
+  { 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 2 },
   { 'eqName': 'A2一次固化机', 'pl': 'C线', 'content': '向江比把设', 'creator': '夏敏', 'time': '1996-12-22 09:29:57', 'priority': 3 },
   { 'eqName': 'A2一次固化机', 'content': '统山数里们步在', 'creator': '龙洋', 'time': '1989-07-19 05:01:55', 'priority': 3 },
   { 'eqName': 'A钢化炉', 'content': '快制放产口快', 'creator': '金艳', 'time': '1987-02-25 18:45:17', 'priority': 4 },
-  { 'eqName': 'A1一次固化机', 'content': '住指时化统高线', 'creator': '顾敏', 'time': '1982-05-09 15:28:29', 'priority': 5 },
+  { 'eqName': 'A1预热机', 'pl': 'D线', 'content': '说资把话', 'creator': '曾刚', 'time': '1985-01-29 23:21:53', 'priority': 3 },
+  { 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 2 },
+  { 'eqName': 'A2一次固化机', 'pl': 'C线', 'content': '向江比把设', 'creator': '夏敏', 'time': '1996-12-22 09:29:57', 'priority': 3 },
+  { 'eqName': 'A2一次固化机', 'content': '统山数里们步在', 'creator': '龙洋', 'time': '1989-07-19 05:01:55', 'priority': 3 },
+  { 'eqName': 'A钢化炉', 'content': '快制放产口快', 'creator': '金艳', 'time': '1987-02-25 18:45:17', 'priority': 4 },
+  { 'eqName': 'A1一次固化机', 'content': '住指时化统高线', 'creator': '顾敏', 'time': '1982-05-09 15:28:29', 'priority': 1 },
   { 'eqName': 'B1二次镀膜机', 'pl': 'B线', 'content': '命些种保较会', 'creator': '罗秀英', 'time': '1986-04-02 07:40:03', 'priority': 2 },
   { 'pl': 'B线', 'content': '增元少号安场明去在亲', 'creator': '于丽', 'time': '2004-08-11 11:10:57', 'priority': 4 }]
 
@@ -80,25 +85,33 @@ const LifeRemainComponent = {
 }
 
 export const equipmentAlarmProps = [
-  { label: '设备名称', prop: 'eqName', align: 'center' },
-  { label: '设备编码', prop: 'eqCode', align: 'center' },
+  { label: '设备名称', prop: 'eqName', align: 'center', 'min-width': 100 },
+  { label: '设备编码', prop: 'eqCode', align: 'center', 'min-width': 100 },
   { label: '所属产线', prop: 'pl', align: 'center' },
-  { label: '报警级别', prop: 'priority', align: 'center', width: 80, subcomponent: PriorityComponent },
+  { label: '报警级别', prop: 'priority', align: 'center', subcomponent: PriorityComponent, 'min-width': 85 },
   { label: '报警内容', prop: 'content', align: 'center' }
 ]
 
 export const equipmentAlarmDatalist = [
   { 'eqName': 'A1预热机', 'eqCode': 'SB501464', 'pl': 'C线', 'content': '使决方不相动', 'priority': 3 },
-  { 'eqName': 'A1一次固化机', 'eqCode': 'SB373383', 'pl': 'C线', 'content': '规问示况将料组美联', 'priority': 5 },
+  { 'eqName': 'A1一次固化机', 'eqCode': 'SB373383', 'pl': 'C线', 'content': '规问示况将料组美联', 'priority': 1 },
   { 'eqName': 'B1二次镀膜机', 'eqCode': 'SB788842', 'pl': 'D线', 'content': '了进改京人表无当市手', 'priority': 2 },
-  { 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 5 },
+  { 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 2 },
   { 'eqName': 'B1一次冷却机', 'eqCode': 'SB138810', 'pl': 'E线', 'content': '代利值才之', 'priority': 1 },
-  { 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 5 },
+  { 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 3 },
+  { 'eqName': 'B1二次镀膜机', 'eqCode': 'SB788842', 'pl': 'D线', 'content': '了进改京人表无当市手', 'priority': 2 },
+  { 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 2 },
+  { 'eqName': 'B1一次冷却机', 'eqCode': 'SB138810', 'pl': 'E线', 'content': '代利值才之', 'priority': 1 },
+  { 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 3 },
   {
-    'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 5
+    'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 4
   },
-  { 'eqName': 'A2一次固化机', 'eqCode': 'SB955674', 'pl': 'E线', 'content': '并来水报克见克代', 'priority': 5 },
-  { 'eqName': 'A1预热机', 'eqCode': 'SB415026', 'pl': 'C线', 'content': '元动增断量争', 'priority': 5 },
+  { 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 3 },
+  {
+    'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 4
+  },
+  { 'eqName': 'A2一次固化机', 'eqCode': 'SB955674', 'pl': 'E线', 'content': '并来水报克见克代', 'priority': 2 },
+  { 'eqName': 'A1预热机', 'eqCode': 'SB415026', 'pl': 'C线', 'content': '元动增断量争', 'priority': 1 },
   { 'eqName': 'A钢化炉', 'eqCode': 'SB19064', 'pl': 'D线', 'content': '很这置合它里革民', 'priority': 4 }
 ]
 
@@ -117,7 +130,7 @@ export const equipmentAnalysisData = [
   { 'name': '磨边单元', 'oee': '0.51', 'mtbr': '0.85', 'mtbf': '0.22' },
   { 'name': '丝印', 'oee': '0.75', 'mtbr': '0.92', 'mtbf': '0.93' },
   { 'name': '上片机器人', 'oee': '0.89', 'mtbr': '0.25', 'mtbf': '0.26' },
-  { 'name': '激光打印', 'oee': '0.05', 'mtbr': '0.59', 'mtbf': '0.15' },
+  { 'name': '激光打孔', 'oee': '0.05', 'mtbr': '0.59', 'mtbf': '0.15' },
   { 'name': '镀膜', 'oee': '0.55', 'mtbr': '0.85', 'mtbf': '0.65' }
 ]
 
@@ -132,20 +145,31 @@ export const sparepartsProps = [
 ]
 
 export const sparepartsDatalist = [
-  { 'name': '激光打印', 'eq': 'A2一次固化机', 'pl': 'C线', 'update_time': '2007-08-31 09:15:24', 'remain': -32, 'stock': 457, 'location': '库位74' },
+  { 'name': '激光打孔', 'eq': 'A2一次固化机', 'pl': 'C线', 'update_time': '2007-08-31 09:15:24', 'remain': -32, 'stock': 457, 'location': '库位74' },
   { 'name': '磨边单元', 'eq': 'B1一次冷却机', 'pl': 'C线', 'update_time': '2016-10-02 22:23:09', 'remain': -95, 'stock': 5600, 'location': '库位10' },
-  { 'name': '激光打印', 'eq': 'B1一次冷却机', 'pl': 'C线', 'update_time': '1996-09-17 08:57:52', 'remain': 46, 'stock': 6069, 'location': '库位87' },
+  { 'name': '激光打孔', 'eq': 'B1一次冷却机', 'pl': 'C线', 'update_time': '1996-09-17 08:57:52', 'remain': 46, 'stock': 6069, 'location': '库位87' },
   { 'name': '磨边单元', 'eq': 'A2一次固化机', 'pl': 'D线', 'update_time': '2018-07-18 13:15:01', 'remain': 86, 'stock': 2342, 'location': '库位83' },
   { 'name': '上片机器人', 'eq': 'A2一次固化机', 'pl': 'E线', 'update_time': '1998-06-11 09:01:10', 'remain': 84, 'stock': 4359, 'location': '库位12' },
   { 'name': '丝印', 'eq': 'A1一次固化机', 'pl': 'E线', 'update_time': '2016-02-13 16:20:01', 'remain': -23, 'stock': 888, 'location': '库位69' },
-  { 'name': '激光打印', 'eq': 'A1磨边清洗机', 'pl': 'B线', 'update_time': '2002-04-07 19:13:29', 'remain': 62, 'stock': 4366, 'location': '库位99' },
+  { 'name': '激光打孔', 'eq': 'A1磨边清洗机', 'pl': 'B线', 'update_time': '2002-04-07 19:13:29', 'remain': 62, 'stock': 4366, 'location': '库位99' },
   { 'name': '丝印', 'eq': 'A1一次固化机', 'update_time': '1980-01-17 04:29:56', 'remain': 73, 'stock': 305, 'location': '库位68' },
-  { 'name': '激光打印', 'eq': 'A2一次冷却机', 'pl': 'B线', 'update_time': '2014-02-25 17:19:43', 'remain': 36, 'stock': 199, 'location': '库位86' },
+  { 'name': '激光打孔', 'eq': 'A2一次冷却机', 'pl': 'B线', 'update_time': '2014-02-25 17:19:43', 'remain': 36, 'stock': 199, 'location': '库位86' },
+  { 'name': '上片机器人', 'eq': 'A2一次冷却机', 'pl': 'C线', 'update_time': '2017-01-23 17:01:29', 'remain': -3, 'stock': 146, 'location': '库位79' },
+  { 'name': '激光打孔', 'eq': 'A1磨边清洗机', 'pl': 'B线', 'update_time': '2002-04-07 19:13:29', 'remain': 62, 'stock': 4366, 'location': '库位99' },
+  { 'name': '丝印', 'eq': 'A1一次固化机', 'update_time': '1980-01-17 04:29:56', 'remain': 73, 'stock': 305, 'location': '库位68' },
+  { 'name': '激光打孔', 'eq': 'A2一次冷却机', 'pl': 'B线', 'update_time': '2014-02-25 17:19:43', 'remain': 36, 'stock': 199, 'location': '库位86' },
   { 'name': '上片机器人', 'eq': 'A2一次冷却机', 'pl': 'C线', 'update_time': '2017-01-23 17:01:29', 'remain': -3, 'stock': 146, 'location': '库位79' },
   { 'name': '镀膜', 'eq': 'A2一次固化机', 'pl': 'D线', 'update_time': '2013-02-19 01:29:19', 'remain': 37, 'stock': 6977, 'location': '库位85' },
-  { 'name': '激光打印', 'eq': 'A1预热机', 'pl': 'B线', 'update_time': '1972-04-26 06:54:43', 'remain': -82, 'stock': 5039, 'location': '库位38' }
+  { 'name': '激光打孔', 'eq': 'A1预热机', 'pl': 'B线', 'update_time': '1972-04-26 06:54:43', 'remain': -82, 'stock': 5039, 'location': '库位38' }
 ]
 
+import { default as blue } from './blue.png'
+import { default as orange } from './orange.png'
+import { default as green } from './green.png'
+import { default as red } from './red.png'
+
+console.log('blue', blue)
+
 const StatusComponent = {
   name: 'StatusComponent',
   props: {
@@ -153,19 +177,19 @@ const StatusComponent = {
   },
   computed: {
     statusColor() {
-      const colors = [
-        '#67ff55',
-        'green',
-        '#ffb70c',
-        '#0b58ff',
-        '#ff0c0c'
+      const colors = [green, orange, blue, red
+        // '#67ff55',
+        // '#e0e0e0',
+        // '#ffb70c',
+        // '#0b58ff',
+        // '#ff0c0c'
       ]
       return colors[this.injectData.status - 1]
     },
     statusText() {
       return [
         '已完成',
-        '已下发',
+        // '已下发',
         '已暂定',
         '进行中',
         '已结束'
@@ -173,8 +197,8 @@ const StatusComponent = {
     }
   },
   render: function (h) {
-    return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' } }, [
-      h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '8px' } }, ''),
+    return h('span', { style: { display: 'flex', /** justifyContent: 'center', */ alignItems: 'center', color: '#ffffffb3' } }, [
+      h('span', { style: { width: 'calc(16px * var(--beilv))', height: 'calc(16px * var(--beilv))', background: `url(${this.statusColor}) no-repeat`, backgroundPosition: '20%', backgroundSize: '100%',  marginRight: 'calc(8px * var(--beilv))' } }, ''),
       h('span', this.statusText)
     ])
   }
@@ -190,8 +214,8 @@ export const rightSideProps = [
 ]
 
 export const rightSideDatalist = [
-  { 'orderId': 'OD_3719', 'eq': 'A2一次固化机', 'pl': 'E线', 'status': 2, 'charger': '任洋', 'duration': 5 },
-  { 'orderId': 'OD_6564', 'eq': 'B1二次镀膜机', 'pl': 'D线', 'status': 2, 'charger': '廖丽', 'duration': 6 },
+  { 'orderId': 'OD_3719', 'eq': 'A2一次固化机', 'pl': 'E线', 'status': 1, 'charger': '任洋', 'duration': 5 },
+  { 'orderId': 'OD_6564', 'eq': 'B1二次镀膜机', 'pl': 'D线', 'status': 1, 'charger': '廖丽', 'duration': 6 },
   { 'orderId': 'OD_125', 'eq': 'A钢化炉', 'pl': 'E线', 'status': 3, 'charger': '赖秀兰', 'duration': 2 }
   // { "orderId": "OD_7103", "pl": "C线", "status": 3, "charger": "邱伟", "duration": 7 },
 ]

src/views/FactoryManage/AbnormalAlarm.vue

@@ -99,23 +99,19 @@ const tableProps = [
   {
     prop: 'createTime',
     label: i18n.t('module.factory.abnormalAlarm.alarmTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'alarmType',
-    label: i18n.t('module.factory.abnormalAlarm.alarmType'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.alarmType')
   },
   {
     prop: 'alarmGrade',
-    label: i18n.t('module.factory.abnormalAlarm.alarmLevel'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.alarmLevel')
   },
   {
     prop: 'alarmContent',
-    label: i18n.t('module.factory.abnormalAlarm.alarmReason'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.alarmReason')
   },
   // {
   //   prop: 'alarmNotify',
@@ -131,7 +127,6 @@ const tableProps = [
   {
     prop: 'status',
     label: i18n.t('module.factory.abnormalAlarm.status'),
-    align: 'center',
     filter: factory('alarmStatus')
   }
   // {

src/views/FactoryManage/EquipmentAlarm.vue

@@ -88,50 +88,41 @@ const tableProps = [
   {
     prop: 'createTime',
     label: i18n.t('module.factory.abnormalAlarm.alarmStartTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'handleTime',
     label: i18n.t('module.factory.abnormalAlarm.alarmEndTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'equipmentName',
-    label: i18n.t('module.factory.abnormalAlarm.equipmentName'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.equipmentName')
   },
   {
     prop: 'alarmGrade',
-    label: i18n.t('module.basicData.alarmManagement.AlarmLevel'),
-    align: 'center'
+    label: i18n.t('module.basicData.alarmManagement.AlarmLevel')
   },
   {
     prop: 'equipmentArea',
-    label: i18n.t('module.factory.abnormalAlarm.equipmentArea'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.equipmentArea')
   },
   {
     prop: 'alarmContent',
-    label: i18n.t('module.factory.abnormalAlarm.alarmInfo'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.alarmInfo')
   },
   {
     prop: 'alarmNotify',
-    label: i18n.t('module.factory.abnormalAlarm.alarmNotify'),
-    align: 'center'
+    label: i18n.t('module.factory.abnormalAlarm.alarmNotify')
   },
   {
     prop: 'status',
     label: i18n.t('module.factory.abnormalAlarm.alarmStatus'),
-    align: 'center',
     subcomponent: AlarmStatus
   },
   {
     prop: 'remark',
-    label: i18n.t('module.basicData.visual.Remarks'),
-    align: 'center'
+    label: i18n.t('module.basicData.visual.Remarks')
   }
 ]
 export default {

src/views/FactoryManage/ShiftManager.vue

@@ -107,29 +107,24 @@ const tableProps = [
   {
     prop: 'planHandoverTime',
     label: i18n.t('module.teamManager.shift.onlineTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'planOfflineTime',
     label: i18n.t('module.teamManager.shift.offlineTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'className',
-    label: i18n.t('module.teamManager.shift.teamName'),
-    align: 'center'
+    label: i18n.t('module.teamManager.shift.teamName')
   },
   {
     prop: 'classCode',
-    label: i18n.t('module.teamManager.shift.teamCode'),
-    align: 'center'
+    label: i18n.t('module.teamManager.shift.teamCode')
   },
   {
     prop: 'planSection',
     label: i18n.t('module.teamManager.shift.lineOrProcess'),
-    align: 'center',
     // subcomponent: shiftManagerLine
     subcomponent: {
       props: {
@@ -161,18 +156,15 @@ const tableProps = [
   },
   {
     prop: 'planTeamName',
-    label: i18n.t('module.teamManager.shift.handoverTeam'),
-    align: 'center'
+    label: i18n.t('module.teamManager.shift.handoverTeam')
   },
   {
     prop: 'planTeamLeader',
-    label: i18n.t('module.teamManager.shift.handoverMonitor'),
-    align: 'center'
+    label: i18n.t('module.teamManager.shift.handoverMonitor')
   },
   {
     prop: 'handoverStatus',
     label: i18n.t('module.teamManager.shift.status'),
-    align: 'center',
     subcomponent: shiftManagerStatus
   },
   // {

src/views/FactoryManage/TeamInfo.vue

@@ -98,35 +98,29 @@ const tableProps = [
   // },
   {
     prop: 'className',
-    label: i18n.t('module.teamManager.teamInfo.className'),
-    align: 'center'
+    label: i18n.t('module.teamManager.teamInfo.className')
   },
   {
     prop: 'classCode',
-    label: i18n.t('module.teamManager.teamInfo.classCode'),
-    align: 'center'
+    label: i18n.t('module.teamManager.teamInfo.classCode')
   },
   {
     prop: 'planTeamName',
-    label: i18n.t('module.teamManager.teamInfo.planTeamName'),
-    align: 'center'
+    label: i18n.t('module.teamManager.teamInfo.planTeamName')
   },
   {
     prop: 'planPreTeamName',
-    label: i18n.t('module.teamManager.teamInfo.planPreTeamName'),
-    align: 'center'
+    label: i18n.t('module.teamManager.teamInfo.planPreTeamName')
   },
   {
     prop: 'planHandoverTime',
     label: i18n.t('module.teamManager.teamInfo.onlineTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   },
   {
     prop: 'planOfflineTime',
     label: i18n.t('module.teamManager.teamInfo.offlineTime'),
-    filter: timeFormatter,
-    align: 'center'
+    filter: timeFormatter
   }
   // {
   //   prop: 'workStatus',

src/views/QualityManager/HomePage.vue

@@ -4,11 +4,11 @@
     <section class="techy-body">
       <div class="part-1">
         <div>
-          <techy-container :title="'质量异常上报'" :icon="qualitySVG">
-            <div class="fix-table-exception-report">
+          <techy-container :title="'质量异常上报'" icon="质量1">
+            <div class="table-wrapper fix-table-exception-report">
               <techy-table
                 :page="1"
-                :limit="10"
+                :limit="20"
                 :show-index="false"
                 :table-config="qualityTableProps"
                 :table-data="qualityDatalist"
@@ -17,32 +17,34 @@
           </techy-container>
         </div>
 
-        <div class="fix-table-exception-alert">
-          <techy-container :title="'质量异常报警'" :icon="qualityExceptionSVG">
-            <techy-table
-              :page="1"
-              :limit="8"
-              :show-index="false"
-              :table-config="qualityExceptionTableProps"
-              :table-data="qualityExceptionDatalist"
-            />
+        <div class=" fix-table-exception-alert">
+          <techy-container :title="'质量异常报警'" icon="质量2">
+            <div class="table-wrapper">
+              <techy-table
+                :page="1"
+                :limit="20"
+                :show-index="false"
+                :table-config="qualityExceptionTableProps"
+                :table-data="qualityExceptionDatalist"
+              />
+            </div>
           </techy-container>
         </div>
       </div>
 
       <div class="part-2">
-        <techy-container :title="'质量缺陷分析'" :icon="qualityFaultSVG">
+        <techy-container :title="'质量缺陷分析'" icon="质量3">
           <div v-if="1" class="quality-analysis__body">
             <!-- 第一行 -->
             <div class="quality-analysis__body__row-1">
               <!-- 第一列 -->
               <div class="grow-8 flex gap-16">
                 <div class="grow">
-                  <techy-box class="" style="padding: 16px;">
+                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
                     <techy-analysis-header>缺陷分类分析</techy-analysis-header>
                     <new-bar
-                      :xlabel-font-size="8"
-                      :xlabel-rotate="20"
+                      :xlabel-font-size="10"
+                      :xlabel-rotate="30"
                       :name-list="[
                         '擦划伤1',
                         '擦划伤2',
@@ -70,7 +72,7 @@
                   </techy-box>
                 </div>
                 <div class="grow">
-                  <techy-box class="" style="padding: 16px;">
+                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
                     <techy-analysis-header>工序缺陷分析</techy-analysis-header>
                     <new-bar
                       chart-name="process-fault"
@@ -90,19 +92,27 @@
 
               <!-- 第二列 -->
               <div class="grow-6 flex gap-16">
-                <div class="grow">
-                  <techy-box class="" style="padding: 16px;">
+                <div class="width-222">
+                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
                     <techy-analysis-header>产线缺陷分析</techy-analysis-header>
                     <pl-fault-analysis-pie-chart />
+                    <div class="date-select">
+                      <span :class="{ 'date-select__active': dateMode === 'day' }" @click="dateMode = 'day'">日</span>
+                      <span :class="{ 'date-select__active': dateMode === 'month' }" @click="dateMode = 'month'">
+                        月
+                      </span>
+                    </div>
                   </techy-box>
                 </div>
                 <div class="grow">
-                  <techy-box class="" style="padding: 16px;">
+                  <techy-box class="" style="padding: calc(16px * var(--beilv));">
                     <techy-analysis-header>产品成品率</techy-analysis-header>
                     <new-line-stack />
                     <div class="date-select">
-                      <span>日</span>
-                      <span class="date-select__active">月</span>
+                      <span :class="{ 'date-select__active': dateMode2 === 'day' }" @click="dateMode2 = 'day'">日</span>
+                      <span :class="{ 'date-select__active': dateMode2 === 'month' }" @click="dateMode2 = 'month'">
+                        月
+                      </span>
                     </div>
                   </techy-box>
                 </div>
@@ -112,7 +122,7 @@
 
             <!-- 第二行 -->
             <div class="quality-analysis__body__row-2">
-              <techy-box style="padding: 16px;" class="flex flex-col">
+              <techy-box style="padding: calc(16px * var(--beilv));" class="flex flex-col">
                 <techy-analysis-header>产线A工序质量分析(数量)</techy-analysis-header>
                 <div class="grow grid gap-16-8 column-2 row-5">
                   <techy-analysis-bar
@@ -124,7 +134,7 @@
                   />
                 </div>
               </techy-box>
-              <techy-box style="padding: 16px;" class="flex flex-col">
+              <techy-box style="padding: calc(16px * var(--beilv));" class="flex flex-col">
                 <techy-analysis-header>产线B工序质量分析(数量)</techy-analysis-header>
                 <div class="grow grid gap-16-8 column-2 row-5">
                   <techy-analysis-bar
@@ -136,7 +146,7 @@
                   />
                 </div>
               </techy-box>
-              <techy-box style="padding: 16px;" class="flex flex-col">
+              <techy-box style="padding: calc(16px * var(--beilv));" class="flex flex-col">
                 <techy-analysis-header>产线C工序质量分析(数量)</techy-analysis-header>
                 <div class="grow grid gap-16-8 column-2 row-5">
                   <techy-analysis-bar
@@ -148,7 +158,7 @@
                   />
                 </div>
               </techy-box>
-              <techy-box style="padding: 16px;" class="flex flex-col">
+              <techy-box style="padding: calc(16px * var(--beilv));" class="flex flex-col">
                 <techy-analysis-header>产线D工序质量分析(数量)</techy-analysis-header>
                 <div class="grow grid gap-16-8 column-2 row-5">
                   <techy-analysis-bar
@@ -184,102 +194,6 @@ import NewLineStack from './components/charts/newLineStack.vue'
 
 import { qualityDatalist, qualityTableProps, qualityExceptionDatalist, qualityExceptionTableProps } from './mockData'
 
-const qualitySVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>质量上报</title>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-5质量管理" transform="translate(-384.000000, -254.000000)">
-            <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-3" fill="#6EF9E1"></path>
-                    <path d="M15.8982,17.8 L15.8982,20.15 C15.8622,20.495 16.1052,20.809 16.4482,20.86 L22.2982,20.86 C22.6462,20.814 22.8942,20.499 22.8582,20.15 L22.8582,17.73 C22.8582,17.56 22.7482,17.42 22.6282,17.42 C22.4772,17.441 22.3702,17.578 22.3882,17.73 L22.3882,20.24 L16.3882,20.24 L16.3882,17.72 C16.3882,17.56 16.2782,17.43 16.1582,17.43 C16.0382,17.43 15.9382,17.56 15.9282,17.72 L15.8982,17.8 Z M22.2982,21.04 L16.4582,21.04 C16.0112,20.992 15.6832,20.598 15.7182,20.15 L15.7182,17.67 C15.7192,17.449 15.8992,17.271 16.1202,17.2729833 C16.3392,17.274 16.5172,17.45 16.5182,17.67 L16.5182,20.1 L22.1782,20.1 L22.1782,17.78 C22.1422,17.551 22.2992,17.336 22.5282,17.3 C22.7572,17.265 22.9722,17.421 23.0082,17.651 C23.0152,17.694 23.0152,17.738 23.0082,17.78 L23.0082,20.2 C23.0182,20.619 22.7132,20.98 22.2982,21.04 L22.2982,21.04 Z" id="Fill-5" fill="#6EF9E1"></path>
-                    <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-7" fill="#6FFADE"></path>
-                    <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-9" fill="#6FFADE"></path>
-                    <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-11" fill="#6FFADE"></path>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-13" fill="#6EF9E1"></path>
-                    <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Stroke-15" stroke="#6EF9E1" stroke-width="0.2"></path>
-                    <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-17" fill="#6FFADE"></path>
-                    <path d="M12.2967,6.8498 L11.9997,12.7348 C11.9267,13.1178 11.5587,13.3688 11.1757,13.2948 C10.8917,13.2418 10.6697,13.0188 10.6147,12.7348 L10.3057,6.8498 L10.3057,6.7878 C10.3937,6.2348 10.9127,5.8568 11.4647,5.9438 C11.8997,6.0118 12.2407,6.3528 12.3087,6.7878 C12.3137,6.8078 12.3137,6.8288 12.3087,6.8498 L12.2967,6.8498 Z M11.3077,15.4668 C10.9047,15.4878 10.5627,15.1778 10.5417,14.7758 C10.5217,14.3728 10.8317,14.0308 11.2337,14.0098 C11.6357,13.9898 11.9787,14.2988 11.9987,14.7018 C11.9997,14.7178 12.0007,14.7338 11.9997,14.7498 C12.0067,15.1388 11.6967,15.4598 11.3077,15.4668 Z" id="Fill-19" fill="#6EF9E1"></path>
-                    <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-21" fill="#6FFADE"></path>
-                    <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-23" fill="#6FFADE"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-const qualityExceptionSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>质量异常报警</title>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
-            <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
-                <g id="编组" transform="translate(24.000000, 24.000000)">
-                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                    <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
-                    <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
-                    <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
-                    <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
-                    <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
-                    <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
-                    <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
-                    <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
-                    <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
-                    <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
-                    <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
-                    <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-const qualityFaultSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>质量缺陷分析</title>
-    <defs>
-        <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
-        <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
-    </defs>
-    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
-            <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                <g id="编组" transform="translate(24.000000, 16.000000)">
-                    <g>
-                        <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
-                        <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
-                    </g>
-                    <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
-                    <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
-                    <g transform="translate(3.130000, 2.179202)">
-                        <mask id="mask-2" fill="white">
-                            <use xlink:href="#path-1"></use>
-                        </mask>
-                        <g id="Clip-10"></g>
-                        <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
-                    </g>
-                    <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
-                        <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
-                        <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
-                        <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
-                    </g>
-                    <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
-                    <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
-                    <g transform="translate(3.130000, 2.179202)">
-                        <mask id="mask-4" fill="white">
-                            <use xlink:href="#path-3"></use>
-                        </mask>
-                        <g id="Clip-22"></g>
-                        <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
-                    </g>
-                    <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
-                        <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
-                        <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
-                        <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
-                        <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>`
-
 export default {
   name: 'QualityManagerHome',
   components: {
@@ -296,10 +210,8 @@ export default {
   },
   data() {
     return {
-      qualitySVG,
-      qualityExceptionSVG,
-      qualityFaultSVG,
-
+      dateMode: 'month',
+      dateMode2: 'month',
       qualityTableProps,
       qualityDatalist,
       qualityExceptionDatalist,
@@ -337,6 +249,27 @@ export default {
 </script>
 
 <style scoped>
+::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
 .fix-table-exception-alert >>> .el-table td .cell {
   width: 75% !important;
   margin: auto;
@@ -348,12 +281,11 @@ export default {
   text-align: left;
 }
 
-
-
 .visual-container {
   width: 100%;
-  min-width: 1280px;
-  /* height: calc(100vh - 96px); */
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
   background: url('./assets/bg.png') no-repeat;
   background-size: cover;
   overflow: hidden;
@@ -361,14 +293,18 @@ export default {
 }
 
 .techy-body {
-  height: calc(100vh - 96px);
+  flex: 1 0;
+  height: 65vh;
   width: 100%;
-  padding: calc(100vw / 1920 * 24);
-  /* display: grid;
-  grid-template-rows: minmax(280px, 25vh) 1fr; */
+  padding: calc(24px * var(--beilv));
   display: flex;
   flex-direction: column;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
+}
+
+.table-wrapper {
+  height: calc(100% - 3vh);
+  overflow: auto;
 }
 
 .grid {
@@ -376,8 +312,7 @@ export default {
 }
 
 .gap-16-8 {
-  /* gap: calc(100vw / 1920 * 16) calc(100vw / 1920 * 8); */
-  gap: calc(100vw / 1920 * 8);
+  gap: calc(12px * var(--beilv)) calc(8px * var(--beilv));
 }
 
 .column-2 {
@@ -385,38 +320,38 @@ export default {
 }
 
 .row-5 {
-  grid-template-rows: repeat(5, 25px);
+  grid-template-rows: repeat(5, calc(24px * var(--beilv)));
 }
 
 .part-1 {
-  /* flex: 1 1; */
   display: flex;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
   flex: 1;
+  height: calc(263px * var(--beilv));
 }
 
 .part-1 > div {
+  width: 30px;
   flex: 1 1;
 }
 
 .part-2 {
-  flex: 1 1;
+  flex: 0;
+  height: calc(542px * var(--beilv));
 }
 
 .quality-analysis__body {
   height: calc(100% - 32px);
   display: flex;
   flex-direction: column;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
 }
 
 .quality-analysis__body__row-1 {
-  /* flex: 1 1;
-  max-height: 25vh; */
-  height: 25vh;
+  height: calc(216px * var(--beilv));
   overflow: hidden;
   display: flex;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
 }
 
 .quality-analysis__body__row-2 {
@@ -425,7 +360,7 @@ export default {
   /* flex: 1.5 1.5; */
   overflow: hidden;
   display: flex;
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
   font-size: 0.65vw;
 }
 
@@ -471,14 +406,14 @@ export default {
 }
 
 .gap-16 {
-  gap: calc(100vw / 1920 * 16);
+  gap: calc(16px * var(--beilv));
 }
 
 .date-select {
   position: absolute;
-  top: calc(100vh / 1920 * 22);
-  right: calc(100vw / 1440 * 12);
-  border-radius: 2px;
+  top: calc(16px * var(--beilv));
+  right: calc(10px * var(--beilv));
+  border-radius: calc(2px * var(--beilv));
   overflow: hidden;
   display: flex;
   cursor: pointer;
@@ -486,15 +421,19 @@ export default {
 
 .date-select span {
   display: inline-block;
-  width: 40px;
+  width: calc(40px * var(--beilv));
   text-align: center;
-  font-size: 12px;
-  line-height: 18px;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
   color: white;
   background-color: #31878c94;
 }
 
 .date-select span.date-select__active {
-  background-color: #42BBB7;
+  background-color: #42bbb7;
+}
+
+.width-222 {
+  width: calc(375px * var(--beilv));
 }
 </style>

src/views/QualityManager/components/TechyAnalysisBar.vue

@@ -57,7 +57,7 @@ export default {
 
 .quality-analysis-bar {
   border-radius: 2px;
-  padding: 2px;
+  padding: calc(2px * var(--beilv));
   display: flex;
 }
 
@@ -77,23 +77,23 @@ export default {
 .placeholder-block-wrapper {
   flex-grow: 1;
   overflow: hidden;
-  min-width: 32px;
+  min-width: calc(32px * var(--beilv));
   position: relative;
   display: flex;
   justify-content: center;
 }
 
 .placeholder-block-wrapper > div {
-  width: 300px;
+  width: calc(300px * var(--beilv));
   position: absolute;
   top: 0;
   right: 0;
 }
 
 .placeholder-block {
-  width: 20px;
-  height: 20px;
-  margin-left: 3px;
+  width: calc(20px * var(--beilv));
+  height: calc(20px * var(--beilv));
+  margin-left: calc(3px * var(--beilv));
 }
 
 .block-green-5 {
@@ -178,9 +178,9 @@ export default {
   overflow: hidden;
   color: white;
   display: inline-block;
-  padding: 3px 8px;
-  font-size: 14px;
-  line-height: 12px;
+  padding: calc(3px * var(--beilv)) calc(8px * var(--beilv));
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(12px * var(--beilv));
 }
 
 .quality-analysis-bar__amount {
@@ -189,8 +189,8 @@ export default {
   /* min-width: 35%; */
   width: 35%;
   text-align: left;
-  padding: 3px 0;
-  font-size: 14px;
-  line-height: 12px;
+  padding: calc(3px * var(--beilv)) 0;
+  font-size: calc(14px * var(--beilv));;
+  line-height: calc(12px * var(--beilv));;
 }
 </style>

src/views/QualityManager/components/TechyAnalysisHeader.vue

@@ -1,116 +1,112 @@
 <template>
   <div class="techy-analysis-header">
-    <span v-html="titleLeftSVG" />
+    <span class="top-icon">
+      <svg
+        width="100%"
+        height="100%"
+        viewBox="0 0 56 13"
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+      >
+        <title>left</title>
+        <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+          <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
+            <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+              <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                  <g
+                    id="编组-2备份"
+                    transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
+                  >
+                    <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                    <polygon
+                      id="路径-11备份"
+                      opacity="0.8"
+                      points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-3"
+                      opacity="0.4"
+                      points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-2"
+                      opacity="0.601434"
+                      points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-4"
+                      opacity="0.201434"
+                      points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                    ></polygon>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    </span>
     <span class="techy-analysis-header__title">
       <slot />
     </span>
-    <span v-html="titleRightSVG" />
+    <span class="top-icon">
+      <svg
+        width="100%"
+        height="100%"
+        viewBox="0 0 56 13"
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+      >
+        <title>right</title>
+        <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+          <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
+            <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+              <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
+                <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
+                  <g
+                    id="编组-2备份-2"
+                    transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
+                  >
+                    <polygon id="路径-11" points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"></polygon>
+                    <polygon
+                      id="路径-11备份"
+                      opacity="0.8"
+                      points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-3"
+                      opacity="0.4"
+                      points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-2"
+                      opacity="0.601434"
+                      points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
+                    ></polygon>
+                    <polygon
+                      id="路径-11备份-4"
+                      opacity="0.201434"
+                      points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
+                    ></polygon>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    </span>
   </div>
 </template>
 
 <script>
-const titleLeftSVG = `<svg
-                    width="56px"
-                    height="13px"
-                    viewBox="0 0 56 13"
-                    version="1.1"
-                    xmlns="http://www.w3.org/2000/svg"
-                    xmlns:xlink="http://www.w3.org/1999/xlink"
-                  >
-                    <title>left</title>
-                    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
-                        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                          <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                            <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                              <g
-                                id="编组-2备份"
-                                transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
-                              >
-                                <polygon
-                                  id="路径-11"
-                                  points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份"
-                                  opacity="0.8"
-                                  points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-3"
-                                  opacity="0.4"
-                                  points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-2"
-                                  opacity="0.601434"
-                                  points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-4"
-                                  opacity="0.201434"
-                                  points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                                ></polygon>
-                              </g>
-                            </g>
-                          </g>
-                        </g>
-                      </g>
-                    </g>
-                  </svg>`
-const titleRightSVG = `<svg
-                    width="56px"
-                    height="13px"
-                    viewBox="0 0 56 13"
-                    version="1.1"
-                    xmlns="http://www.w3.org/2000/svg"
-                    xmlns:xlink="http://www.w3.org/1999/xlink"
-                  >
-                    <title>right</title>
-                    <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
-                        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
-                          <g id="编组-20备份" transform="translate(24.000000, 277.000000)">
-                            <g id="编组-13备份" transform="translate(35.000000, 16.000000)">
-                              <g
-                                id="编组-2备份-2"
-                                transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
-                              >
-                                <polygon
-                                  id="路径-11"
-                                  points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份"
-                                  opacity="0.8"
-                                  points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-3"
-                                  opacity="0.4"
-                                  points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-2"
-                                  opacity="0.601434"
-                                  points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
-                                ></polygon>
-                                <polygon
-                                  id="路径-11备份-4"
-                                  opacity="0.201434"
-                                  points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
-                                ></polygon>
-                              </g>
-                            </g>
-                          </g>
-                        </g>
-                      </g>
-                    </g></svg>`
-
 export default {
   name: 'TechyAnalysisHeader',
   data() {
-    return { titleLeftSVG, titleRightSVG }
+    return {}
   }
 }
 </script>
@@ -118,12 +114,18 @@ export default {
 <style scoped>
 .techy-analysis-header {
   text-align: center;
-  margin-bottom: 16px;
+  margin-bottom: calc(16px * var(--beilv));
 }
 
 .techy-analysis-header__title {
   color: #01cfcc;
-  font-size: 15px;
-  line-height: 18px;
+  font-size: calc(15px * var(--beilv));
+  line-height: calc(18px * var(--beilv));
+}
+
+.top-icon {
+  display: inline-block;
+  width: calc(56px * var(--beilv));
+  height: calc(13px * var(--beilv));
 }
 </style>

src/views/QualityManager/components/TechyBox.vue

@@ -11,7 +11,7 @@ export default {}
 <style scoped>
 .techy-box {
   background: transparent;
-  box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.5);
+  box-shadow: inset 0 0 calc(17px * var(--beilv)) 0 rgba(255, 255, 255, 0.2);
   display: inline-block;
   height: 100%;
   width: 100%;

src/views/QualityManager/components/TechyContainer.vue

@@ -12,7 +12,7 @@
     </template>
 
     <div class="container-title-wrapper">
-      <span class="container-icon" v-html="icon" />
+      <span class="container-icon" v-html="computeIcon" />
       <span class="container-title">{{ title }}</span>
     </div>
 
@@ -21,6 +21,8 @@
 </template>
 
 <script>
+import { IconBanshou, IconTrend, IconMenuChilun, IconSafetyHat, IconQuality, IconQuality2, IconQuality3 } from './icons'
+
 export default {
   name: 'TechyContainer',
   props: {
@@ -34,21 +36,41 @@ export default {
   data() {
     return {}
   },
+  computed: {
+    computeIcon() {
+      switch (this.icon) {
+        case '扳手螺丝刀':
+          return IconBanshou
+        case '趋势搜索':
+          return IconTrend
+        case '清单齿轮':
+          return IconMenuChilun
+        case '安全帽':
+          return IconSafetyHat
+        case '质量1':
+          return IconQuality
+        case '质量2':
+          return IconQuality2
+        case '质量3':
+          return IconQuality3
+        // more...
+      }
+    }
+  },
   mounted() {}
 }
 </script>
 
 <style scoped>
 .techy-container {
-  border: 2px solid #52fff1;
+  border: calc(2px * var(--beilv)) solid #52fff1;
   border-image: linear-gradient(90deg, rgba(82, 255, 241, 0.6), rgba(95, 190, 249, 0), rgba(82, 255, 241, 0.6)) 2 2;
   display: inline-block;
   position: relative;
-  /* padding: 24px; */
-  padding: calc(100vw / 1920 * 22);
+  padding: calc(24px * var(--beilv));
   width: 100%;
   height: 100%;
-  box-shadow: inset 0px 0px 20px 0px rgba(255,255,255,0.15);
+  box-shadow: inset 0px 0px 20px 0px rgba(255, 255, 255, 0.15);
 }
 
 .line {
@@ -57,58 +79,47 @@ export default {
 }
 
 .horizontal {
-  /* height: 4px;
-  width: 24px; */
-  /* height: 0.325vh;
-  width: 3vh; */
-  height: calc(100vw / 1920 * 4);
-  width: calc(100vw / 1920 * 30);
+  height: calc(4px * var(--beilv));
+  width: calc(26px * var(--beilv));
 }
 
 .vertical {
-  /* height: 24px;
-  width: 4px; */
-  /* height: 3vh;
-  width: 0.325vh; */
-  height: calc(100vw / 1920 * 30);
-  width: calc(100vw / 1920 * 4);
+  height: calc(26px * var(--beilv));
+  width: calc(4px * var(--beilv));
 }
 
 .top {
-  top: -3px;
+  top: calc(-3px * var(--beilv));
 }
 
 .left {
-  left: -3px;
+  left: calc(-3px * var(--beilv));
 }
 
 .right {
-  right: -3px;
+  right: calc(-3px * var(--beilv));
 }
 
 .bottom {
-  bottom: -3px;
+  bottom: calc(-3px * var(--beilv));
 }
 
 .container-title-wrapper {
   color: #52fff1;
   display: flex;
   align-items: center;
-  /* font-size: 18px;
+  font-size: calc(18px * var(--beilv));
   line-height: 1;
-  height: 24px;
-  margin-bottom: 8px; */
-  /* font-size: 1.25vh;
-  line-height: 1;
-  height: 1.5vh;
-  margin-bottom: 1.25vh; */
-  font-size: calc((100vw / 1920) * 16);
-  line-height: 1;
-  height: calc((100vw / 1920) * 20);
-  margin-bottom: 1.5vh;
+  margin-bottom: calc(8px * var(--beilv));
 }
 
 .container-title {
-  margin-left: 4px;
+  margin-left: calc(4px * var(--beilv));
+}
+
+.container-icon {
+  position: relative;
+  height: calc(24px * var(--beilv)) !important;
+  width: calc(24px * var(--beilv)) !important;
 }
 </style>

src/views/QualityManager/components/TechyHeader.vue

@@ -1,17 +1,38 @@
 <template>
   <header class="techy-header">
-    <img class="logo-img" src="./logo.png" alt="cnbm">
-    <span style="display: line-block; margin-left: calc(100vw / 1920 * 8); letter-spacing: 3px;">{{ headTitle }}</span>
+    <div class="center-header">
+      <img class="logo-img" src="./logo.png" alt="cnbm">
+      <span class="techy-header__title">{{ headTitle }}</span>
+    </div>
 
-    <span class="fullscreen-btn" @click="handleClick('fullscreen')">
-      <span v-if="isFullScreen" v-html="unfullScreenSvg" />
-      <span v-else v-html="fullScreenSvg" />
-    </span>
+    <!-- <div class="date">2022.10.14</div>
+    <div class="time">20:12:24</div> -->
+
+    <div class="fullscreen-btn">
+      <!-- <span style="color: #52fff1; margin-right: 8px;" @click="handleClick('home')" v-html="homeSvg" /> -->
+      <span v-if="isFullScreen" @click="handleClick('fullscreen')" v-html="unfullScreenSvg" />
+      <span v-else @click="handleClick('fullscreen')" v-html="fullScreenSvg" />
+    </div>
   </header>
 </template>
 
 <script>
-const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+// const homeSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const homeSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>首页</title>
+    <g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="1大屏-数字工厂总览" transform="translate(-1824.000000, -46.000000)" fill-rule="nonzero">
+            <g id="首页" transform="translate(1824.000000, 46.000000)">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="32" height="32"></rect>
+                <path d="M3.36212554,9.99760304 L14.4561021,2.03491762 C15.37881,1.37257076 16.62119,1.37257076 17.5438979,2.03491762 L28.6378745,9.99760304 C29.7265595,10.7789878 30.3723957,12.0369335 30.3723957,13.3770071 L30.3723957,26.217608 C30.3723957,28.5153002 28.5096576,30.3780383 26.2119654,30.3780383 L5.78803465,30.3780383 C3.49034244,30.3780383 1.62760433,28.5153002 1.62760433,26.217608 L1.62760433,13.3773853 C1.62760433,12.0371783 2.27333209,10.7790656 3.36212554,9.99760304 Z M4.68552062,11.8410519 C4.19052975,12.196239 3.89692996,12.7681449 3.89692996,13.3773853 L3.89692996,26.217608 C3.89692996,27.2620363 4.74360637,28.1087127 5.78803465,28.1087127 L26.2119654,28.1087127 C27.2563936,28.1087127 28.10307,27.2620363 28.10307,26.217608 L28.10307,13.3773853 C28.10307,12.7681449 27.8094702,12.196239 27.3144794,11.8410519 L16.2205028,3.87836647 C16.0887105,3.78379718 15.9112895,3.78379718 15.7794972,3.87836647 L4.68552062,11.8414301 L4.68552062,11.8410519 Z" id="形状" fill="#42D0CE"></path>
+                <path d="M16.25,17 C16.8972087,17 17.4295339,17.4918747 17.4935464,18.1221948 L17.5,18.25 L17.5,28.25 C17.5,28.9403559 16.9403559,29.5 16.25,29.5 C15.6027913,29.5 15.0704661,29.0081253 15.0064536,28.3778052 L15,28.25 L15,18.25 C15,17.5596441 15.5596441,17 16.25,17 Z" id="路径-3" fill="#42D0CE"></path>
+            </g>
+        </g>
+    </g>
+</svg>`
+
+// const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const fullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组 54备份</title>
     <g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <g id="2-4设备管理" transform="translate(-1864.000000, -162.000000)">
@@ -23,7 +44,8 @@ const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" versi
     </g>
 </svg>`
 
-const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+// const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const unfullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组 54备份 2</title>
     <g id="3WMS。1、2、3、4、5、6" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
         <g id="编组-54备份-2">
@@ -32,13 +54,13 @@ const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" ver
         </g>
     </g>
 </svg>`
-
 export default {
   name: 'TechyHeader',
   props: ['headTitle'],
   data() {
     return {
       fullScreenSvg,
+      homeSvg,
       unfullScreenSvg,
       isFullScreen: false
     }
@@ -48,6 +70,8 @@ export default {
       if (source === 'fullscreen') {
         this.isFullScreen = !this.isFullScreen
         this.$emit('toggle-full-screen', { full: this.isFullScreen })
+      } else if (source === 'home') {
+        this.$router.push('/')
       }
     }
   }
@@ -55,6 +79,16 @@ export default {
 </script>
 
 <style scoped>
+/* @font-face {
+  font-family: 'zcoolqingkehuangyouti';
+  src: url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff2') format('woff2'),
+      url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff') format('woff'),
+      url('./assets/fonts/zcoolqingkehuangyouti-Regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+} */
+
 .techy-header {
   background: transparent;
   display: flex;
@@ -63,30 +97,75 @@ export default {
   position: relative;
   color: white;
   /* font-size: 24px; */
-  font-size: 2vh;
-  padding: calc(100vw / 1920 * 16) 0;
+  padding: calc(24px * var(--beilv)) 0;
   line-height: 1;
   background: url(./header-new.png) no-repeat;
   /** 背景图片好像左右不对称 : */
   /* background-position: bottom left 40px;  */
   /* background-size: cover; */
   background-size: 100% 100%;
-  background-position: bottom left calc(100vw / 1920 * 40);
-  height: calc(100vw / 1920 * 80);
+  background-position: bottom;
+  /* background-position: bottom left calc(32px * var(--beilv)); */
+  height: calc(96px * var(--beilv));
+}
+
+.center-header {
+  /* transform: translateX(calc(-18px * var(--beilv))); */
+  transform: translateX(-8%) translateY(18%);
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .logo-img {
-  width: calc(100vw / 1920 * 24);
+  width: calc(28px * var(--beilv));
+}
+
+.techy-header__title {
+  display: line-block;
+  margin-left: calc(12px * var(--beilv));
+  /* font-size: 29px; */
+  font-size: calc(29px * var(--beilv));
+  line-height: calc(41px * var(--beilv));
+  letter-spacing: calc(2.23px * var(--beilv));
+  text-shadow: 0px 0px calc(11px * var(--beilv)) rgba(221, 237, 255, 0.34);
+}
+
+.date,
+.time {
+  /* font-family: zcoolqingkehuangyouti, sans-serif; */
+  font-size: calc(100vmin / 1920 * 42);
+  line-height: 1.5;
+  /* font-size: 28px;
+  line-height: 36px; */
+  color: #49e1de;
+  letter-spacing: 0.8px;
+  position: absolute;
+  bottom: calc(100vmin / 1920 * 14);
+}
+
+.date {
+  /* left: 72px; */
+  left: calc(100vmin / 1920 * 72);
+}
+
+.time {
+  /* right: 128px; */
+  right: calc(100vmin / 1920 * 186);
 }
 
 .fullscreen-btn {
-  width: 32px;
-  height: 32px;
   cursor: pointer;
   position: absolute;
-  /* right: 24px;  */
   /** techy-body 的内部 padding 值 */
-  right: calc(100vw / 1920 * 24);
+  right: calc(24px * var(--beilv));
+  top: calc(44px * var(--beilv));
   bottom: 0;
 }
+
+.fullscreen-btn > span {
+  display: inline-block;
+  width: calc(32px * var(--beilv));
+  height: calc(32px * var(--beilv));
+}
 </style>

src/views/QualityManager/components/TechyTable.vue

@@ -7,15 +7,14 @@
 -->
 <template>
   <div class="visual-base-table-container">
-    <el-table
-      v-loading="isLoading"
-      :header-cell-style="{background:'rgba(79,114,136,0.29)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}"
-      :row-style="setRowStyle"
-      :data="renderData"
-      border
-      style="width: 100%; background: transparent"
-    >
-      <el-table-column v-if="page && limit && showIndex" prop="_pageIndex" :label="'tableHeader.index' | i18nFilter" :width="70 * beilv" align="center" />
+    <el-table v-loading="isLoading" class="techy-el-table" :data="renderData" border height="100%">
+      <el-table-column
+        v-if="page && limit && showIndex"
+        prop="_pageIndex"
+        :label="'tableHeader.index' | i18nFilter"
+        :width="70 * beilv"
+        align="center"
+      />
       <el-table-column
         v-for="(item, index) in renderTableHeadList"
         :key="item.prop"
@@ -23,10 +22,14 @@
         v-bind="item"
       >
         <template slot-scope="scope">
-
-          <component :is="item.subcomponent" v-if="item.subcomponent" :key="index" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
+          <component
+            :is="item.subcomponent"
+            v-if="item.subcomponent"
+            :key="index"
+            :inject-data="{ ...scope.row, ...item }"
+            @emitData="emitData"
+          />
           <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-
         </template>
       </el-table-column>
       <slot name="content" />
@@ -107,82 +110,103 @@ export default {
   methods: {
     emitData(val) {
       this.$emit('emitFun', val)
-    },
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(76,97,123,0.2)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      } else {
-        return {
-          background: 'rgba(79,114,136,0.29)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      }
-    },
-    setCellStyle(v) {
-      return {
-        lineHeight: 23 * this.beilv + 'px'
-      }
     }
   }
 }
 </script>
-<style lang="scss">
-@import "~@/styles/index.scss";
+
+<style scoped>
+.visual-base-table-container >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
+/* .visual-base-table-container {
+  min-width: 30vw;
+} */
 .visual-base-table-container {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
-
-  // new
-  .el-table {
-    width: 100%;
-    .el-table__header-wrapper table, .el-table__body-wrapper table {
-      width: 100% !important;
-    }
-
-    .el-table__body, .el-table__footer, .el-table__header {
-      table-layout: auto;
-    }
-  }
+  height: 100%;
 }
-.setting {
-  text-align: right;
-  padding: 15px;
-  .setting-box {
-    width: 100px;
-  }
-  i {
-    color: #aaa;
-    @extend .pointer;
-  }
+/* .visual-base-table-container >>> .el-table {
+  min-width: 120%;
+} */
+/* 清除默认样式 */
+.visual-base-table-container >>> th.gutter {
+  display: none;
+}
+.visual-base-table-container >>> table {
+  background: transparent;
 }
 
+.visual-base-table-container >>> .el-table,
+.visual-base-table-container >>> th,
+.visual-base-table-container >>> tr {
+  background: unset;
+}
+
+/* 设置设计稿样式 */
+.visual-base-table-container >>> .el-table::before,
+.visual-base-table-container >>> .el-table--group::after,
+.visual-base-table-container >>> .el-table--border::after,
+.visual-base-table-container >>> .el-table--border::after {
+  background: unset;
+}
+
+.visual-base-table-container >>> table * {
+  border-color: #0d1728;
+  border-width: calc(1px * var(--beilv));
+}
+
+.visual-base-table-container >>> td {
+  padding: calc(5px * var(--beilv));
+}
+
+.visual-base-table-container >>> td span {
+  color: #ffffffb3;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+}
+
+.visual-base-table-container >>> thead th {
+  padding: 0;
+}
+
+.visual-base-table-container >>> thead th .cell {
+  color: #fff;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  padding: calc(6px * var(--beilv));
+  white-space: nowrap;
+}
+
+.visual-base-table-container >>> .el-table__body tr:hover > td {
+  background-color: #42537130;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(odd) {
+  background-color: #0e203e;
+  /* background-color: #0e203e90; */
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(even),
+.visual-base-table-container >>> .el-table thead {
+  background-color: #203760;
+  /* background-color: #20376090; */
+}
 </style>

src/views/QualityManager/components/charts/PlFaultAnalysisPieChart.vue

@@ -1,16 +1,20 @@
 <template>
-  <div ref="chartContainer" class="chartContainer" style="position: relative; width: 100%; height: calc(100% - 36px)" />
+  <div ref="chartContainer" class="chartContainer" />
 </template>
 
 <script>
 import echarts from 'echarts'
-// import 'echarts/theme/macarons'
 import resize from '@/views/OperationalOverview/components/mixins/resize'
 
 export default {
-  name: 'PlFaultAnalysisPieChart',
+  name: 'RightContentFaultAnalysis',
   mixins: [resize],
-  props: {},
+  props: {
+    id: {
+      type: String,
+      default: 'default-fault-analysis-id'
+    }
+  },
   data() {
     let totalRate = 0
     const colors = [
@@ -81,20 +85,29 @@ export default {
       }
     ]
 
+    const demoData = [
+      { value: 55, name: 'A' },
+      { value: 33, name: 'B' },
+      { value: 22, name: 'C' },
+      { value: 11, name: 'D' },
+      { value: 32, name: 'E' }
+    ]
+
     return {
       chart: null,
       // default configs
       configs: {
         title: {
           textAlign: 'center',
-          left: '59%',
+          left: '63%',
           top: '35%',
           text: '33039',
           textStyle: {
             color: '#fff',
-            fontSize: 26,
+            fontSize: 16,
             fontWeight: 'normal'
           },
+          itemGap: 2,
           subtext: '总数',
           subtextStyle: {
             color: '#fff',
@@ -103,20 +116,17 @@ export default {
           }
         },
         legend: {
-          top: '20%',
-          bottom: '25%',
-          left: 0,
+          top: 0,
+          bottom: 0,
+          left: -10,
           orient: 'vertical',
           icon: 'none',
+          itemGap: 5,
+          itemWidth: 10,
           formatter: function(name) {
             // test data - dynamic
-            const testData = [
-              { name: 'A', value: 100 },
-              { name: 'B', value: 200 },
-              { name: 'C', value: 300 },
-              { name: 'D', value: 400 },
-              { name: 'E', value: 500 }
-            ]
+            const testData = demoData
+
             let pieLegendVale = {}
             testData.filter((item, index) => {
               if (item.name === name) {
@@ -134,20 +144,19 @@ export default {
           textStyle: {
             rich: {
               a: {
-                align: 'center',
                 fontSize: 10,
                 color: 'rgba(255, 255, 255, 0.7)',
                 lineHeight: 16
               },
               b: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 fontSize: 10,
                 color: 'rgba(255, 255, 255)'
               },
               c: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 width: 10,
                 borderRadius: 5,
                 height: 10,
@@ -156,7 +165,7 @@ export default {
               },
               d: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 width: 10,
                 borderRadius: 5,
                 height: 10,
@@ -165,7 +174,7 @@ export default {
               },
               e: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 width: 10,
                 borderRadius: 5,
                 height: 10,
@@ -174,7 +183,7 @@ export default {
               },
               f: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 width: 10,
                 borderRadius: 5,
                 height: 10,
@@ -183,7 +192,7 @@ export default {
               },
               g: {
                 // verticalAlign: 'top',
-                align: 'center',
+                // align: 'center',
                 width: 10,
                 borderRadius: 5,
                 height: 10,
@@ -198,8 +207,8 @@ export default {
           {
             name: 'PieForm',
             type: 'pie',
-            center: ['60%', '45%'],
-            radius: ['50%', '70%'],
+            center: ['65%', '48%'],
+            radius: ['60%', '85%'],
             avoidLabelOverlap: true,
             label: {
               formatter: params => {
@@ -207,13 +216,17 @@ export default {
                 return `{${colorMap[params.dataIndex]}|${params.percent} %}`
               },
               rich: {
-                first: { color: '#FB418C', fontSize: 12 },
-                second: { color: '#DDB112', fontSize: 12 },
-                third: { color: '#1A99FF', fontSize: 12 },
-                fourth: { color: '#A691FF', fontSize: 12 },
-                fifth: { color: '#49FBD6', fontSize: 12 }
+                first: { color: '#FB418C', fontSize: 8 },
+                second: { color: '#DDB112', fontSize: 8 },
+                third: { color: '#1A99FF', fontSize: 8 },
+                fourth: { color: '#A691FF', fontSize: 8 },
+                fifth: { color: '#49FBD6', fontSize: 8 }
               }
             },
+            labelLine: {
+              length: 5,
+              length2: 5
+            },
             itemStyle: {
               color: params => {
                 /** 计算渐变方向的过程，只靠 dataIndex 不太行 */
@@ -227,6 +240,11 @@ export default {
                   colorGradient.y = 0
                   colorGradient.x2 = 1
                   colorGradient.y2 = 1
+                } else if (totalRate + percent >= 50 && dataIndex == 1) {
+                  colorGradient.x = 1
+                  colorGradient.y = 1
+                  colorGradient.x2 = 0
+                  colorGradient.y2 = 0
                 } else if (totalRate + percent < 100) {
                   /** 也许这里需要完善，但目前工作良好 */
                   (() => {})()
@@ -236,40 +254,99 @@ export default {
                 return colorGradient
               }
             },
-            data: [
-              { value: 100, name: 'A' },
-              { value: 200, name: 'B' },
-              { value: 300, name: 'C' },
-              { value: 400, name: 'D' },
-              { value: 500, name: 'E' }
-            ]
+            data: demoData
           }
         ]
       }
     }
   },
   mounted() {
-    window.addEventListener('resize', function() {
+    window.addEventListener('resize', () => {
       if (this.chart) {
         this.chart.resize()
+        this.$nextTick(() => {
+          // 重新绘制文本大小
+          this.applyChartOption()
+        })
       }
     })
 
     this.$nextTick(() => {
       // if (!this.chart) this.chart = echarts.init(this.$refs.chartContainer, { width: '100%', height: '100%' })
-      if (!this.chart) this.chart = echarts.init(this.$refs.chartContainer)
-
-      this.chart.setOption(this.configs)
-
+      if (!this.chart) this.chart = echarts.init(this.$refs['chartContainer'])
+      this.applyChartOption()
       this.chart.resize()
     })
   },
-  methods: {}
+
+  methods: {
+    calcFontsize(baseSize) {
+      const beilv = document.documentElement.style.getPropertyValue('--beilv')
+      return beilv * baseSize
+    },
+    // calcRate(baseRate) {
+    //   const beilv = document.documentElement.style.getPropertyValue('--beilv')
+    //   return baseRate * beilv
+    // },
+    applyChartOption() {
+      const fs1 = this.calcFontsize(1 /** px*/)
+      const fs3 = this.calcFontsize(3 /** px*/)
+      const fs5 = this.calcFontsize(5 /** px*/)
+      const fs8 = this.calcFontsize(8 /** px*/)
+      const fs10 = this.calcFontsize(10 /** px*/)
+      const fs14 = this.calcFontsize(14 /** px*/)
+      const fs16 = this.calcFontsize(16 /** px*/)
+      const rate10 = this.calcFontsize(10 /** % */)
+      const rate3 = this.calcFontsize(3 /** % */)
+
+      this.configs.title.textStyle.fontSize = fs14
+      this.configs.title.subtextStyle.fontSize = fs10
+
+      this.configs.legend.top = rate10 + '%'
+      this.configs.legend.left = rate3 + '%'
+      this.configs.legend.itemGap = fs5
+      this.configs.legend.itemWidth = fs10
+
+      this.configs.legend.textStyle.rich.a.fontSize = fs10
+      this.configs.legend.textStyle.rich.a.lineHeight = fs10
+      this.configs.legend.textStyle.rich.b.fontSize = fs10
+      // this.configs.legend.textStyle.rich.b.lineHeight = fs16
+      this.configs.legend.textStyle.rich.c.width = fs10
+      this.configs.legend.textStyle.rich.c.height = fs10
+      this.configs.legend.textStyle.rich.c.borderRadius = fs5
+      this.configs.legend.textStyle.rich.d.width = fs10
+      this.configs.legend.textStyle.rich.d.height = fs10
+      this.configs.legend.textStyle.rich.d.borderRadius = fs5
+      this.configs.legend.textStyle.rich.e.width = fs10
+      this.configs.legend.textStyle.rich.e.height = fs10
+      this.configs.legend.textStyle.rich.e.borderRadius = fs5
+      this.configs.legend.textStyle.rich.f.width = fs10
+      this.configs.legend.textStyle.rich.f.height = fs10
+      this.configs.legend.textStyle.rich.f.borderRadius = fs5
+      this.configs.legend.textStyle.rich.g.width = fs10
+      this.configs.legend.textStyle.rich.g.height = fs10
+      this.configs.legend.textStyle.rich.g.borderRadius = fs5
+
+      this.configs.series[0].label.rich.first.fontSize = fs10
+      this.configs.series[0].label.rich.second.fontSize = fs10
+      this.configs.series[0].label.rich.third.fontSize = fs10
+      this.configs.series[0].label.rich.fourth.fontSize = fs10
+      this.configs.series[0].label.rich.fifth.fontSize = fs10
+
+      this.chart.setOption(this.configs)
+    }
+  }
 }
 </script>
 
 <style scoped>
-.chartContainer >>> div {
+.chartContainer {
+  height: calc(100% - (36px * var(--beilv)));
+  position: relative;
+  width: 100%;
+}
+
+.chartContainer > div {
   width: 100% !important;
 }
 </style>

src/views/QualityManager/components/charts/newBar.vue

@@ -52,12 +52,13 @@ export default {
   },
   mounted() {
     if (this.dataList.length > 1) {
+      const barWidth = 400 / 2 / this.dataList[0].data.length
       this.series = [
         {
           // 柱体
           name: this.dataList[0].name,
           type: 'bar',
-          barWidth: 30,
+          barWidth,
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: this.dataList[0].topColor },
@@ -70,7 +71,7 @@ export default {
           // 柱顶
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          barWidth: 26,
+          barWidth,
           symbol: 'diamond',
           symbolPosition: 'end',
           symbolOffset: [0, '-50%'],
@@ -83,7 +84,7 @@ export default {
           // 柱底
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          barWidth: 26,
+          barWidth,
           symbol: 'diamond',
           symbolOffset: [0, '50%'],
           symbolSize: [30, 15],
@@ -94,7 +95,7 @@ export default {
           // 柱体
           name: this.dataList[1].name,
           type: 'bar',
-          barWidth: 30,
+          barWidth,
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: this.dataList[1].topColor },
@@ -107,7 +108,7 @@ export default {
           // 柱顶
           name: this.dataList[1].name,
           type: 'pictorialBar',
-          barWidth: 26,
+          barWidth,
           symbol: 'diamond',
           symbolPosition: 'end',
           symbolOffset: [0, '-50%'],
@@ -120,7 +121,7 @@ export default {
           // 柱底
           name: this.dataList[1].name,
           type: 'pictorialBar',
-          barWidth: 26,
+          barWidth,
           symbol: 'diamond',
           symbolOffset: [0, '50%'],
           symbolSize: [30, 15],
@@ -129,7 +130,7 @@ export default {
         }
       ]
     } else {
-      const barWidth = 400 / 2 / this.dataList[0].data.length
+      const barWidth = 320 / 2 / this.dataList[0].data.length
       this.series = [
         {
           // 柱体
@@ -166,7 +167,7 @@ export default {
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: 'rgba(59, 76, 118, 0)' },
-              { offset: 1, color: '#2c6e7d' }
+              { offset: 1, color: this.dataList[0].bottomColor }
             ])
           },
           label: {
@@ -187,7 +188,7 @@ export default {
           symbol: 'circle',
           symbolOffset: [0, '50%'],
           symbolSize: [barWidth, 6],
-          itemStyle: { color: '#2c6e7d' },
+          itemStyle: { color: this.dataList[0].bottomColor + '9f' },
           data: this.dataList[0].data
         }
       ]
@@ -272,30 +273,31 @@ export default {
 }
 
 .fault-category-chart >>> div::before {
-/* .fault-category-chart::before { */
+  /* .fault-category-chart::before { */
   content: '';
   position: absolute;
-  /* bottom: calc(100vh/1920 * 80);
-  left: calc(100vw/1920 * 48); */
-  /* bottom: calc(10% + 100vh/1920 * 28); */
-  bottom: 25px;
+  bottom: calc(36px * var(--beilv));
+  /* top: 63%; */
   left: 9%;
-  height: 52px;
+  height: calc(32px * var(--beilv));
   width: 90%;
   background: linear-gradient(to top, #31a2ff6d, transparent);
-  transform: skew(-45deg);
+  transform: skew(-35deg);
   z-index: 0;
 }
 .process-fault-chart >>> div::before {
-/* .process-fault-chart::before { */
+  /* .process-fault-chart::before { */
   content: '';
   position: absolute;
-  bottom: 26px;
-  left: 10%;
-  height: 48px;
+  top: 65%;
+  left: 8%;
+  height: calc(32px * var(--beilv));
+  /* bottom: calc(20px * var(--beilv));
+  left: calc(36px * var(--beilv));
+  height: calc(32px * var(--beilv)); */
   width: 90%;
   background: linear-gradient(to top, #49fbd789, transparent);
-  transform: skew(-45deg);
+  transform: skew(-35deg);
   z-index: 0;
 }
 </style>

src/views/QualityManager/components/icons.js

@@ -0,0 +1,394 @@
+// 扳手
+export const IconBanshou = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>setting tools</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M5.8599,18.0898 C6.4089,18.6418 7.3019,18.6448 7.8539,18.0958 C7.8559,18.0938 7.8579,18.0918 7.8599,18.0898 L14.5199,11.4298 L14.8899,11.4998 L15.0599,11.4998 C16.6169,11.7418 18.1089,10.7848 18.5399,9.2698 L18.2299,9.6198 C17.1349,10.6718 15.4049,10.6718 14.3099,9.6198 C13.2319,8.5358 13.2319,6.7838 14.3099,5.6998 L14.5999,5.4098 C13.0609,5.8908 12.1389,7.4618 12.4699,9.0398 L12.5499,9.4098 L5.8809,16.0798 C5.6139,16.3438 5.4659,16.7048 5.46982098,17.0798 C5.4729,17.4538 5.6199,17.8118 5.8809,18.0798 L5.8599,18.0898 Z M6.8599,19.8698 C6.1109,19.8828 5.3889,19.5898 4.8599,19.0598 C3.7809,17.9838 3.7769,16.2358 4.8529,15.1568 C4.8559,15.1538 4.8579,15.1518 4.8599,15.1498 L11.0099,8.9898 C10.7039,6.6548 12.2459,4.4768 14.5499,3.9898 L14.7799,3.9398 L15.0899,3.9398 C15.6049,3.8968 16.0939,4.1748 16.3199,4.6398 C16.4859,5.0968 16.3549,5.6088 15.9899,5.9298 L15.2299,6.6898 C14.6769,7.2388 14.6749,8.1318 15.2239,8.6838 L15.2299,8.6898 C15.7859,9.2338 16.6739,9.2338 17.2299,8.6898 L17.9899,7.9198 C18.2099,7.6868 18.5099,7.5478 18.8299,7.5298 C19.1509,7.5208 19.4599,7.6568 19.6709,7.8998 C19.9429,8.2518 20.0459,8.7058 19.9499,9.1398 C19.5749,11.5408 17.3609,13.2088 14.9499,12.9098 L8.7999,19.0598 C8.2859,19.5748 7.5889,19.8668 6.8599,19.8698 L6.8599,19.8698 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-7" fill="#6FFADE"></path>
+                <polygon id="Fill-9" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+                <path d="M5.3901,18.6099 C4.5621,17.8059 4.5411,16.4829 5.3451,15.6549 C5.3601,15.6399 5.3741,15.6249 5.3901,15.6099 L11.7891,9.2099 C11.3521,7.1479 12.6671,5.1199 14.7301,4.6799 L14.9301,4.6799 L15.1501,4.6799 C15.7401,4.6799 15.9301,5.1099 15.5501,5.4899 L14.7891,6.2499 C13.9611,7.0789 13.9611,8.4219 14.7891,9.2499 C15.6191,10.0789 16.9611,10.0789 17.7891,9.2499 L18.5501,8.4899 C18.6531,8.3769 18.7971,8.3079 18.9501,8.2999 C19.2201,8.2999 19.4301,8.5999 19.3501,9.1099 C19.0271,11.1909 17.0811,12.6169 15.0001,12.2999 L14.7901,12.2999 L8.3901,18.6999 C7.5861,19.5279 6.2631,19.5479 5.4351,18.7449 C5.4191,18.7299 5.4051,18.7149 5.3901,18.6999 L5.3901,18.6099 Z" id="Stroke-13" stroke="#6FFADE" stroke-width="1.5"></path>
+                <path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-15" fill="#6FFADE"></path>
+                <polygon id="Fill-17" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 趋势+放大镜
+export const IconTrend = `<svg  width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>analysis</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-384.000000, -533.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 509.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-25" fill="#6FFADE"></path>
+                <path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-27" fill="#6FFADE"></path>
+                <path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-29" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+齿轮
+export const IconMenuChilun = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+    <polygon id="path-3" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-1532.000000, -254.000000)">
+        <g id="编组-6" transform="translate(1508.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-5" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-8"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-7" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-9" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-11" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-13" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-15" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-17" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-19" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-21" fill="#6DF8E1"></path>
+                </g>
+                <path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-23" fill="#6EF9E1"></path>
+                <path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-25" fill="#6EF9E1"></path>
+                <g transform="translate(3.140000, 2.930055)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-28"></g>
+                    <path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-27" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.579800, 7.340500)">
+                    <path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-29" fill="#6FFADE"></path>
+                    <path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-31" fill="#6EF9E1"></path>
+                    <path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-33" fill="#6EF9E1"></path>
+                    <path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-35" fill="#6EF9E1"></path>
+                    <path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-37" fill="#6DF8E1"></path>
+                    <path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-39" fill="#6DF8E1"></path>
+                    <path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-41" fill="#6DF8E1"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 闪电安全帽
+export const IconSafetyHat = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>hatplus</title>
+<defs>
+    <linearGradient x1="100%" y1="100%" x2="20.318998%" y2="7.84095011e-14%" id="linearGradient-1">
+        <stop stop-color="#4BFFC8" offset="0%"></stop>
+        <stop stop-color="#45F2EC" offset="100%"></stop>
+    </linearGradient>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-4设备管理" transform="translate(-998.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(974.000000, 230.000000)">
+            <g id="编组-6" transform="translate(24.000000, 24.000000)">
+                <rect id="矩形" x="0" y="0" width="24" height="24"></rect>
+                <g id="异常" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="17" height="17"></rect>
+                    <path d="M9.00003613,1.00009438 C7.45266489,0.991339384 5.96400493,1.59197413 4.85604619,2.6721807 C3.77420104,3.74179852 3.16375561,5.19879645 3.16005953,6.72012488 L3.16005953,14.5280306 L14.7760126,14.5280306 L14.7760126,6.72010926 C14.7746725,5.19671341 14.1605756,3.73789487 13.0720104,2.67216507 C11.9832986,1.60721536 10.5229694,1.00760431 9.0000205,1.00009438 L9.00003613,1.00009438 Z M8.52003548,12.6560576 L8.35203526,8.87208057 L5.48804703,8.87208057 L9.24800521,4.12815624 L9.56800564,7.18412206 L12.2880093,7.28012148 L8.48800418,12.6560576 L8.52003548,12.6560576 Z M1.00003551,16.1280053 C0.997937773,15.8953576 1.08886376,15.671504 1.25262424,15.5062394 C1.41638472,15.3409748 1.63939864,15.2480106 1.87205781,15.2480106 L16.1280144,15.2480106 C16.3586463,15.2508825 16.5792874,15.3425823 16.7440153,15.5040247 C16.9059435,15.6716664 16.9975415,15.894943 17,16.1280053 C17,16.6095886 16.6096013,17 16.1280144,17 L1.87205781,17 C1.39047096,17 1.00003551,16.6095886 1.00003551,16.1280053 L1.00003551,16.1280053 Z" id="形状" fill="url(#linearGradient-1)"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality = `<svg width="100%" height="100%"  viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量上报</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -254.000000)">
+        <g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M15.8982,17.8 L15.8982,20.15 C15.8622,20.495 16.1052,20.809 16.4482,20.86 L22.2982,20.86 C22.6462,20.814 22.8942,20.499 22.8582,20.15 L22.8582,17.73 C22.8582,17.56 22.7482,17.42 22.6282,17.42 C22.4772,17.441 22.3702,17.578 22.3882,17.73 L22.3882,20.24 L16.3882,20.24 L16.3882,17.72 C16.3882,17.56 16.2782,17.43 16.1582,17.43 C16.0382,17.43 15.9382,17.56 15.9282,17.72 L15.8982,17.8 Z M22.2982,21.04 L16.4582,21.04 C16.0112,20.992 15.6832,20.598 15.7182,20.15 L15.7182,17.67 C15.7192,17.449 15.8992,17.271 16.1202,17.2729833 C16.3392,17.274 16.5172,17.45 16.5182,17.67 L16.5182,20.1 L22.1782,20.1 L22.1782,17.78 C22.1422,17.551 22.2992,17.336 22.5282,17.3 C22.7572,17.265 22.9722,17.421 23.0082,17.651 C23.0152,17.694 23.0152,17.738 23.0082,17.78 L23.0082,20.2 C23.0182,20.619 22.7132,20.98 22.2982,21.04 L22.2982,21.04 Z" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M22.6282,17.3303 C22.4272,17.3513 22.2812,17.5283 22.2982,17.7293 L22.2982,20.1493 L16.4582,20.1493 L16.4582,17.7403 C16.4582,17.5633 16.3152,17.4203 16.1382,17.4203 C15.9612,17.4203 15.8182,17.5633 15.8182,17.7403 L15.8182,20.1703 C15.7822,20.5643 16.0652,20.9183 16.4582,20.9703 L22.3082,20.9703 C22.7052,20.9233 22.9932,20.5683 22.9582,20.1703 L22.9582,17.7503 C22.9762,17.5523 22.8352,17.3763 22.6382,17.3503 L22.6282,17.3303 Z" id="Stroke-15" stroke="#6EF9E1" stroke-width="0.2"></path>
+                <path d="M19.7483,12.5002 C19.7033,12.4462 19.6443,12.4042 19.5783,12.3802 L19.1783,12.3802 C19.1103,12.4012 19.0513,12.4432 19.0083,12.5002 L17.5583,14.1302 C17.3733,14.3372 17.3913,14.6552 17.5983,14.8402 C17.8053,15.0242 18.1233,15.0072 18.3083,14.8002 L18.8783,14.1402 L18.8783,17.8992 C18.8773,17.9162 18.8773,17.9342 18.8783,17.9502 L18.8783,18.3002 C18.8833,18.5732 19.1043,18.7952 19.3783,18.8002 C19.6503,18.7942 19.8683,18.5722 19.8683,18.3002 L19.8683,14.0902 L20.4483,14.7502 C20.6333,14.9572 20.9513,14.9752 21.1583,14.7902 C21.3653,14.6042 21.3833,14.2872 21.1983,14.0802 L19.7483,12.5002 Z" id="Fill-17" fill="#6FFADE"></path>
+                <path d="M12.2967,6.8498 L11.9997,12.7348 C11.9267,13.1178 11.5587,13.3688 11.1757,13.2948 C10.8917,13.2418 10.6697,13.0188 10.6147,12.7348 L10.3057,6.8498 L10.3057,6.7878 C10.3937,6.2348 10.9127,5.8568 11.4647,5.9438 C11.8997,6.0118 12.2407,6.3528 12.3087,6.7878 C12.3137,6.8078 12.3137,6.8288 12.3087,6.8498 L12.2967,6.8498 Z M11.3077,15.4668 C10.9047,15.4878 10.5627,15.1778 10.5417,14.7758 C10.5217,14.3728 10.8317,14.0308 11.2337,14.0098 C11.6357,13.9898 11.9787,14.2988 11.9987,14.7018 C11.9997,14.7178 12.0007,14.7338 11.9997,14.7498 C12.0067,15.1388 11.6967,15.4598 11.3077,15.4668 Z" id="Fill-19" fill="#6EF9E1"></path>
+                <path d="M13.7781,19.5002 L3.0881,19.5002 C2.6541,19.5852 2.3721,20.0062 2.4571,20.4382 C2.5201,20.7582 2.7691,21.0072 3.0881,21.0692 L13.7981,21.0692 C14.2291,20.9722 14.4991,20.5432 14.4011,20.1122 C14.3321,19.8122 14.0981,19.5782 13.7981,19.5102 L13.7781,19.5002 Z" id="Fill-21" fill="#6FFADE"></path>
+                <path d="M17.2684,2.9104 L5.3984,2.9104 C3.7414,2.9104 2.3984,4.2534 2.3984,5.9104 L2.3984,15.3704 C2.3984,17.0264 3.7414,18.3704 5.3984,18.3704 L13.7084,18.3704 C14.0684,18.3704 14.3484,17.9504 14.3484,17.5904 C14.3484,17.2294 14.0684,16.8004 13.7084,16.8004 L5.7084,16.8004 C4.7694,16.8064 4.0034,16.0494 3.9984,15.1094 L3.9984,15.0904 L3.9984,6.1894 C3.9984,5.2674 4.7464,4.5194 5.6684,4.5194 L17.1184,4.5194 C18.0404,4.5194 18.7884,5.2674 18.7884,6.1894 L18.7884,10.2904 L18.7884,10.3804 L18.7884,10.4604 C18.8484,10.8524 19.2144,11.1234 19.6084,11.0634 C19.9794,11.0084 20.2454,10.6754 20.2184,10.3004 L20.2184,5.8704 C20.1974,4.2484 18.8904,2.9364 17.2684,2.9104" id="Fill-23" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality2 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量异常报警</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 质量
+export const IconQuality3 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>质量缺陷分析</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 折角的菜单图标
+export const IconMenu1 = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-1040.000000, -253.000000)">
+        <g id="编组-16备份-6" transform="translate(1016.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M16.3899,8.0902 C16.3899,8.5802 16.1899,8.8202 15.7999,8.8202 L10.0999,8.8202 C9.6999,8.8202 9.5099,8.5802 9.5099,8.0902 C9.5099,7.6002 9.6999,7.3702 10.0999,7.3702 L15.7999,7.3702 C16.1899,7.3702 16.3899,7.6102 16.3899,8.0902" id="Fill-3" fill="#6EF9E1"></path>
+                <path d="M14.51,11.95 C14.51,12.43 14.31,12.68 13.91,12.68 L10.11,12.68 C9.71,12.68 9.51,12.43 9.51,11.95 C9.51,11.47 9.71,11.23 10.11,11.23 L13.91,11.23 C14.31,11.23 14.51,11.47 14.51,11.95" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M12.5701,15.7801 C12.5701,16.2601 12.3701,16.5001 11.9601,16.5001 L10.1201,16.5001 C9.7101,16.5001 9.5101,16.2601 9.5101,15.7801 C9.5101,15.3001 9.7101,15.0601 10.1201,15.0601 L11.9601,15.0601 C12.3701,15.0601 12.5701,15.3001 12.5701,15.7801" id="Fill-7" fill="#6EF9E1"></path>
+                <path d="M8.0398,7.39 L8.0398,7.39 C8.4378,7.39 8.7598,7.712 8.7598,8.11 C8.7598,8.508 8.4378,8.83 8.0398,8.83 C7.6428,8.83 7.3198,8.508 7.3198,8.11 C7.3198,7.712 7.6428,7.39 8.0398,7.39" id="Fill-9" fill="#6DF8E1"></path>
+                <path d="M8.0398,11.2699 L8.0398,11.2699 C8.4378,11.2699 8.7598,11.5919 8.7598,11.9899 C8.7598,12.3879 8.4378,12.7099 8.0398,12.7099 C7.6428,12.7099 7.3198,12.3879 7.3198,11.9899 C7.3198,11.5919 7.6428,11.2699 8.0398,11.2699" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M8.0398,15.1502 L8.0398,15.1502 C8.4378,15.1502 8.7598,15.4722 8.7598,15.8702 C8.7598,16.2672 8.4378,16.5902 8.0398,16.5902 C7.6428,16.5902 7.3198,16.2672 7.3198,15.8702 C7.3198,15.4722 7.6428,15.1502 8.0398,15.1502" id="Fill-13" fill="#6DF8E1"></path>
+                <path d="M15.5501,19.7801 L15.5501,16.7801 L18.3401,16.7801 L15.5501,19.7801 Z M19.2201,9.6501 C18.7891,9.6501 18.4401,9.9991 18.4401,10.4301 C18.4401,10.4331 18.4401,10.4371 18.4401,10.4401 L18.4401,15.1501 L14.3801,15.1501 C14.1571,15.1551 13.9801,15.3371 13.9801,15.5601 L13.9801,20.0301 L6.6901,19.9601 C6.0901,19.9601 5.5901,19.1201 5.5901,18.5001 L5.5901,5.7801 C5.5901,5.1711 6.0811,4.6761 6.6901,4.6701 L17.3401,4.6701 C17.9491,4.6761 18.4401,5.1711 18.4401,5.7801 L18.4401,7.7801 C18.4411,8.2111 18.7911,8.5591 19.2211,8.5581 C19.6511,8.5581 19.9991,8.2101 20.0001,7.7801 L20.0001,4.7801 C19.9731,3.9181 19.2721,3.2301 18.4101,3.2201 L5.5001,3.2201 C4.6551,3.2251 3.9741,3.9151 3.98006066,4.7601 L4.0501,20.0901 C4.0441,20.9351 4.7251,21.6241 5.5701,21.6301 L14.8101,21.6301 L14.8701,21.6301 L14.9301,21.6301 L19.7401,17.0401 C19.8511,16.9251 19.9121,16.7701 19.9101,16.6101 L19.9101,10.6601 C20.0331,10.2411 19.7941,9.8021 19.3751,9.6791 C19.3241,9.6641 19.2731,9.6551 19.2201,9.6501 L19.2201,9.6501 Z" id="Fill-15" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单+放大镜
+export const IconMenuSearch = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<defs>
+    <polygon id="path-1" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+    <polygon id="path-3" points="0 0 16.1499 0 16.1499 18.6604979 0 18.6604979"></polygon>
+</defs>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-384.000000, -529.000000)">
+        <g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <g>
+                    <polygon id="Fill-1" fill="#6CC1B0" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                    <path d="M16.4896,19.530219 C15.2696,19.5352 14.2756,18.5512 14.2695728,17.3302 C14.2636,16.1092 15.2496,15.1152 16.4696,15.1101728 C17.6906,15.1042 18.6836,16.0902 18.6896,17.3092 L18.6896,17.3202 C18.6896,18.5372 17.7066,19.5242 16.4896,19.530219 M21.0696,20.9602 L19.5106,19.4002 C20.6666,17.7222 20.2446,15.4252 18.5666,14.2672 C16.8886,13.1102 14.5916,13.5332 13.4336,15.2112 C12.2776,16.8882 12.6996,19.1862 14.3776,20.3422 C15.6506,21.2202 17.3366,21.2122 18.5996,20.3202 L20.1496,21.8802 C20.2386,21.9672 20.3816,21.9672 20.4696,21.8802 L21.0696,21.2802 C21.1566,21.1902 21.1566,21.0492 21.0696,20.9602" id="Fill-3" fill="#6EF9E1"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-5" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-7" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-2" fill="white">
+                        <use xlink:href="#path-1"></use>
+                    </mask>
+                    <g id="Clip-10"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-9" fill="#6EF9E1" mask="url(#mask-2)"></path>
+                </g>
+                <g transform="translate(8.839800, 6.600000)" fill="#6EF9E1">
+                    <path d="M7.1,0.73 C7.1,1.22 6.9,1.47 6.491,1.47 L0.61,1.47 C0.201,1.47 0,1.22 0,0.73 C0,0.24 0.201,0 0.61,0 L6.491,0 C6.9,0 7.1,0.24 7.1,0.73" id="Fill-11"></path>
+                    <path d="M5.1703,4.6597 C5.1703,5.1497 4.9603,5.3997 4.5503,5.3997 L0.6203,5.3997 C0.2103,5.3997 0.0003,5.1497 0.0003,4.6597 C0.0003,4.1707 0.2103,3.9207 0.6203,3.9207 L4.5503,3.9207 C4.9603,3.9207 5.1703,4.1707 5.1703,4.6597" id="Fill-13"></path>
+                    <path d="M3.1606,8.5904 C3.1606,9.0794 2.9506,9.3294 2.5296,9.3294 L0.6306,9.3294 C0.2106,9.3294 0.0006,9.0794 0.0006,8.5904 C0.0006,8.1004 0.2106,7.8504 0.6306,7.8504 L2.5296,7.8504 C2.9506,7.8504 3.1606,8.1004 3.1606,8.5904" id="Fill-15"></path>
+                </g>
+                <path d="M9.0697,20.04 C9.0737,20.329 9.2287,20.596 9.4797,20.74 C9.7317,20.881 10.0387,20.881 10.2897,20.74 C10.5387,20.595 10.6907,20.328 10.6897049,20.04 C10.6907,19.755 10.5387,19.491 10.2897,19.35 C10.0387,19.209 9.7317,19.209 9.4797,19.35 C9.2297,19.49 9.0727,19.753 9.0697,20.04" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M17.7103,11.5097 C17.7243,11.9627 18.1033,12.3187 18.5553,12.3037 C18.6873,12.2997 18.8143,12.2647 18.9303,12.1997 C19.1803,12.0607 19.3333,11.7957 19.3303,11.5097 C19.3313,11.2247 19.1783,10.9607 18.9303,10.8207 C18.6783,10.6797 18.3713,10.6797 18.1193,10.8207 C17.8693,10.9597 17.7133,11.2237 17.7103,11.5097" id="Fill-19" fill="#6EF9E1"></path>
+                <g transform="translate(3.130000, 2.179202)">
+                    <mask id="mask-4" fill="white">
+                        <use xlink:href="#path-3"></use>
+                    </mask>
+                    <g id="Clip-22"></g>
+                    <path d="M14.8499,0.000497856693 L1.3499,0.000497856693 C0.6099,-0.00450214331 0.0049,0.590497857 -0.0001,1.33049786 L-0.0001,17.3304979 C-0.0001,18.0644979 0.5949,18.6604979 1.3289,18.6604979 L1.3499,18.6604979 L6.7199,18.6604979 L6.7199,17.0614979 L2.7199,17.0614979 C2.0929,17.0614979 1.5809,16.5584979 1.5699,15.9314979 L1.5699,2.74049786 C1.5759,2.10949786 2.0889,1.60149786 2.7199,1.60149786 L13.3799,1.60149786 C14.0089,1.59549786 14.5249,2.10149786 14.5299,2.73049786 L14.5299,2.74049786 L14.5299,9.33049786 L16.1499,9.33049786 L16.1499,1.33049786 C16.1499,0.978497857 16.0089,0.640497857 15.7599,0.391497857 C15.4939,0.131497857 15.1319,-0.00950214331 14.7599,0.000497856693 L14.8499,0.000497856693 Z" id="Fill-21" fill="#6EF9E1" mask="url(#mask-4)"></path>
+                </g>
+                <g transform="translate(6.609800, 6.600000)" fill="#6EF9E1">
+                    <path d="M9.33,0.73 C9.33,1.22 9.07,1.47 8.53,1.47 L0.801,1.47 C0.27,1.47 0,1.22 0,0.73 C0,0.24 0.27,0 0.801,0 L8.53,0 C9.07,0 9.33,0.24 9.33,0.73" id="Fill-23"></path>
+                    <path d="M6.79,4.6597 C6.79,5.1497 6.52,5.3997 5.971,5.3997 L0.811,5.3997 C0.27,5.3997 8.8817842e-16,5.1497 8.8817842e-16,4.6597 C8.8817842e-16,4.1707 0.27,3.9207 0.811,3.9207 L5.971,3.9207 C6.52,3.9207 6.79,4.1707 6.79,4.6597" id="Fill-25"></path>
+                    <path d="M4.1601,8.5904 C4.1601,9.0794 3.8801,9.3294 3.3301,9.3294 L0.8301,9.3294 C0.2801,9.3294 0.0001,9.0794 0.0001,8.5904 C0.0001,8.1004 0.2801,7.8504 0.8301,7.8504 L3.3301,7.8504 C3.8801,7.8504 4.1601,8.1004 4.1601,8.5904" id="Fill-27"></path>
+                    <path d="M13.9501,14.1197 C14.3091,14.1197 14.6001,14.4107 14.6001,14.7697 C14.6001,15.1297 14.3091,15.4207 13.9501,15.4207 C13.5911,15.4207 13.3001,15.1297 13.3001,14.7697 C13.3001,14.4107 13.5911,14.1197 13.9501,14.1197" id="Fill-29"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+安全帽
+export const IconPCAlert = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-5质量管理" transform="translate(-1104.000000, -254.000000)">
+        <g id="编组-16备份-8" transform="translate(1080.000000, 230.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-3" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-5" fill="#6FFADE"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-7" fill="#6FFADE"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M18.7471,17.0701 L19.7471,15.5901 C19.7941,15.5431 19.7941,15.4671 19.7471,15.4211 L19.7471,15.4201 C19.7251,15.4111 19.6991,15.4111 19.6771,15.4201 L18.8961,15.4201 L18.8961,14.4901 C18.9021,14.4241 18.8531,14.3661 18.7871,14.3601 L18.7771,14.3601 C18.7321,14.3611 18.6921,14.3831 18.6671,14.4201 L17.6671,15.9001 C17.6191,15.9501 17.6191,16.0301 17.6671,16.0801 L17.7371,16.0801 L18.5171,16.0801 L18.5171,17.0091 C18.5121,17.0761 18.5601,17.1331 18.6271,17.1391 C18.6301,17.1391 18.6341,17.1401 18.6371,17.1401 C18.6831,17.1451 18.7261,17.1211 18.7471,17.0801 L18.7471,17.0701 Z" id="Fill-13" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Fill-15" fill="#6FFADE"></path>
+                <path d="M16.6572,15.2303 C16.6602,14.9593 16.7142,14.6913 16.8162,14.4403 C16.9202,14.2003 17.0702,13.9823 17.2572,13.7993 C17.4412,13.6103 17.6622,13.4603 17.9072,13.3603 C18.1542,13.2563 18.4192,13.2023 18.6862,13.2003 C18.9552,13.2033 19.2202,13.2563 19.4672,13.3603 C19.9562,13.5633 20.3442,13.9513 20.5472,14.4403 C20.6492,14.6873 20.7042,14.9523 20.7072,15.2193 L20.7072,17.9193 L16.6272,17.9193 L16.6572,15.2303 Z M16.1072,18.5893 L21.2572,18.5893 C21.3232,18.5893 21.3772,18.5363 21.3772,18.4693 L21.3772,15.2193 C21.2862,13.7313 20.0062,12.5983 18.5172,12.6893 C17.1562,12.7723 16.0702,13.8583 15.9872,15.2193 L15.9872,18.4593 C15.9812,18.5263 16.0302,18.5843 16.0962,18.5893 L16.1072,18.5893 Z" id="Stroke-17" stroke="#6EF9E1" stroke-width="0.5"></path>
+                <path d="M21.3174,19.5604 L16.0874,19.5604 C16.0584,19.5454 16.0254,19.5454 15.9974,19.5604 C15.7554,19.6884 15.6104,19.9464 15.6274,20.2194 C15.6274,20.6104 15.8574,20.9194 16.1364,20.9194 L21.3174,20.9194 C21.6074,20.9194 21.8274,20.6104 21.8274,20.2194 C21.8274,19.8304 21.6274,19.5604 21.3174,19.5604" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 电脑+感叹号+三横
+export const IconPCTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>编组</title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -872.000000)">
+        <g id="编组-17备份" transform="translate(24.000000, 856.000000)">
+            <g id="编组" transform="translate(24.000000, 16.000000)">
+                <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-9" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-11" fill="#6FFADE"></path>
+                <path d="M21.3174,18.5158014 L16.0874,18.5158014 C16.0584,18.5008014 16.0254,18.5008014 15.9974,18.5158014 C15.7554,18.6438014 15.6104,18.9018014 15.6274,19.1748014 C15.6274,19.5658014 15.8574,19.8748014 16.1364,19.8748014 L21.3174,19.8748014 C21.6074,19.8748014 21.8274,19.5658014 21.8274,19.1748014 C21.8274,18.7858014 21.6274,18.5158014 21.3174,18.5158014" id="Fill-19" fill="#6FFADE"></path>
+                <path d="M21.3174,15.9564014 L16.0874,15.9564014 C16.0584,15.9414014 16.0254,15.9414014 15.9974,15.9564014 C15.7554,16.0844014 15.6104,16.3424014 15.6274,16.6154014 C15.6274,17.0064014 15.8574,17.3154014 16.1364,17.3154014 L21.3174,17.3154014 C21.6074,17.3154014 21.8274,17.0064014 21.8274,16.6154014 C21.8274,16.2264014 21.6274,15.9564014 21.3174,15.9564014" id="Fill-19备份" fill="#6FFADE"></path>
+                <path d="M21.3174,13.3970014 L16.0874,13.3970014 C16.0584,13.3820014 16.0254,13.3820014 15.9974,13.3970014 C15.7554,13.5250014 15.6104,13.7830014 15.6274,14.0560014 C15.6274,14.4470014 15.8574,14.7560014 16.1364,14.7560014 L21.3174,14.7560014 C21.6074,14.7560014 21.8274,14.4470014 21.8274,14.0560014 C21.8274,13.6670014 21.6274,13.3970014 21.3174,13.3970014" id="Fill-19备份-2" fill="#6FFADE"></path>
+                <path d="M12.6142,6.6317 L12.3172,12.5177 C12.2452,12.9007 11.8762,13.1517 11.4942,13.0777 C11.2092,13.0247 10.9862,12.8017 10.9322,12.5177 L10.6242,6.6317 L10.6242,6.5697 C10.7112,6.0177 11.2292,5.6397 11.7832,5.7267 C12.2182,5.7947 12.5582,6.1357 12.6272,6.5697 C12.6322,6.5907 12.6322,6.6117 12.6272,6.6317 L12.6142,6.6317 Z M11.6252,15.2497 C11.2222,15.2707 10.8802,14.9607 10.8592,14.5587 C10.8392,14.1557 11.1482,13.8137 11.5512,13.7927 C11.9532,13.7727 12.2962,14.0817 12.3162,14.4847 C12.3172,14.5007 12.3172,14.5167 12.3172,14.5327 C12.3242,14.9217 12.0142,15.2427 11.6252,15.2497 L11.6252,15.2497 Z" id="Fill-21" fill="#6EF9E1"></path>
+                <path d="M13.8174,19.4998 L3.1274,19.4998 C2.7364,19.5298 2.4434,19.8718 2.4744,20.2638 C2.4744,20.2718 2.4754,20.2808 2.4764,20.2898 C2.4374,20.6808 2.7204,21.0288 3.1114,21.0678 C3.1164,21.0688 3.1224,21.0688 3.1274,21.0698 L13.8374,21.0698 C14.2234,21.0228 14.5024,20.6778 14.4664,20.2898 C14.5024,19.8938 14.2134,19.5418 13.8174,19.4998" id="Fill-23" fill="#6FFADE"></path>
+                <path d="M17.3066,2.91 L5.4476,2.91 C3.7896,2.91 2.4476,4.253 2.4476,5.91 L2.4476,15.36 C2.4476,17.016 3.7896,18.36 5.4476,18.36 L13.8276,18.36 C14.1866,18.36 14.4666,17.94 14.4666,17.58 C14.4666,17.22 14.1866,16.79 13.8276,16.79 L5.7166,16.79 C4.7836,16.796 4.0226,16.044 4.0166,15.11 L4.0166,15.08 L4.0166,6.181 C4.0166,5.258 4.7646,4.51 5.6866,4.51 L17.1466,4.51 C18.0636,4.51 18.8066,5.253 18.8066,6.17 L18.8066,6.181 L18.8066,10.29 L18.8066,10.38 L18.8066,10.45 C18.8696,10.843 19.2396,11.11 19.6316,11.047 C19.9946,10.988 20.2546,10.667 20.2376,10.3 L20.2376,5.94 C20.2536,4.299 18.9486,2.948 17.3066,2.91" id="Fill-25" fill="#6FFADE"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 三个菱形叠加
+export const IconTriple = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>物料信息 </title>
+<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="1大屏-数字工厂总览" transform="translate(-48.000000, -392.000000)" fill-rule="nonzero">
+        <g id="物料信息-" transform="translate(48.000000, 392.000000)">
+            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24"></rect>
+            <path d="M20.3505422,14.9151538 L20.458789,14.9215423 C20.8283324,15.1756033 20.9365283,16.0632505 20.5345696,16.3962497 L20.4405365,16.4586841 L12.3478497,20.7032297 C12.2016803,20.79009 11.8833705,20.8006382 11.6976954,20.7375186 L11.6173217,20.699832 L3.53524588,16.5181762 C3.13421554,16.2396631 3.13620989,15.4741677 3.38080569,15.0736815 L3.44148439,14.9881289 L3.57039169,14.9618461 L11.9916374,19.3126195 L20.3505422,14.9151538 Z M20.3505455,11.1907368 L20.4587026,11.1970677 C20.8283142,11.4506321 20.936545,12.3384142 20.5345732,12.6714428 L20.4405365,12.7338816 L12.3478497,16.9784271 C12.2016803,17.0652875 11.8833705,17.0758357 11.6976954,17.012716 L11.6173217,16.9750295 L3.53524588,12.7933736 C3.13421554,12.5148606 3.13620989,11.7493651 3.38080569,11.348879 L3.44148439,11.2633264 L3.57039169,11.2370435 L11.9916374,15.5876251 L20.3505455,11.1907368 Z M12.4463389,3.3309719 L12.5600247,3.40332636 L20.3179067,7.46797471 C20.3828378,7.50198626 20.4422319,7.54565391 20.4941486,7.59757438 C20.8671243,7.97146203 20.8671243,8.57668705 20.4940313,8.95069207 L20.4111763,9.02185105 L20.3185938,9.07973137 L12.5536247,13.1569789 C12.2525083,13.3810327 11.8526139,13.4065554 11.5389056,13.2394459 L11.4256662,13.1677617 L3.66901765,9.16124436 C3.60269972,9.12706228 3.54205927,9.0828421 3.48915918,9.0300661 C3.30967167,8.85060515 3.20883441,8.60718793 3.20883441,8.35337304 C3.20883441,8.09955815 3.30967167,7.85614093 3.48911133,7.67672785 L3.57020807,7.60674321 L3.66079174,7.54945114 L11.4274137,3.41400371 C11.7293235,3.18803429 12.1313281,3.16229769 12.4463389,3.3309719 Z M12.0031732,4.74717805 L5.24637717,8.34632811 L11.9321821,11.8491065 L18.7348003,8.27501628 L12.0031732,4.74717805 Z" id="形状结合" stroke="#6EF9E1" stroke-width="0.2" fill="#77FFF2"></path>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// 菜单 only
+export const IconMenuOnly = `<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<title>菜单</title>
+<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="2-2工单管理" transform="translate(-384.000000, -253.000000)">
+        <g id="编组-16备份-5" transform="translate(360.000000, 229.000000)">
+            <g id="编组" transform="translate(24.000000, 24.000000)">
+                <polygon id="Fill-1" fill="#CAE5DD" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
+                <path d="M18.0901,3.8098 L16.6101,3.8098 L16.6101,4.7298 L18.0901,4.7298 C18.5481,4.7298 18.9201,5.1018 18.9201,5.5598 L18.9201,19.0898 C18.9201,19.5488 18.5481,19.9198 18.0901,19.9198 L5.9501,19.9198 C5.4911,19.9198 5.1201,19.5488 5.1201,19.0898 L5.1201,5.5598 C5.1201,5.1018 5.4911,4.7298 5.9501,4.7298 L7.6501,4.7298 L7.6501,3.8098 L5.9501,3.8098 C4.9861,3.8158 4.2051,4.5958 4.2001,5.5598 L4.2001,19.0898 C4.2051,20.0538 4.9861,20.8348 5.9501,20.8398 L18.1001,20.8398 C19.0641,20.8348 19.8441,20.0538 19.8501,19.0898 L19.8501,5.5598 C19.8441,4.5918 19.0581,3.8098 18.0901,3.8098" id="Fill-3" fill="#6EF9DE"></path>
+                <path d="M5.95,4.1702 C5.182,4.1702 4.56,4.7922 4.56,5.5602 L4.56,19.0902 C4.56,19.8582 5.182,20.4802 5.95,20.4802 L18.1,20.4802 C18.867,20.4802 19.49,19.8582 19.49,19.0902 L19.49,5.5602 C19.49,4.7922 18.867,4.1702 18.1,4.1702 L16.95,4.1702 L16.95,4.3402 L18.07,4.3402 C18.721,4.3402 19.25,4.8682 19.25,5.5202 L19.25,19.0502 C19.25,19.7012 18.721,20.2302 18.07,20.2302 L5.95,20.2302 C5.298,20.2302 4.77,19.7012 4.77,19.0502 L4.77,5.5602 C4.748,4.9082 5.258,4.3622 5.909,4.3402 C5.923,4.3402 5.936,4.3402 5.95,4.3402 L7.3,4.3402 L7.3,4.1302 L5.95,4.1702 Z M18.62,21.1902 L5.41,21.1902 C4.543,21.1902 3.84,20.4872 3.84,19.6202 L3.84,5.0302 C3.84,4.1632 4.543,3.4602 5.41,3.4602 L8,3.4602 L8,5.0902 L6.61,5.0902 C5.98,5.0902 5.47,5.6002 5.47,6.2302 L5.47,18.4202 C5.47,19.0492 5.98,19.5602 6.61,19.5602 L17.42,19.5602 C18.05,19.5602 18.56,19.0492 18.56,18.4202 L18.56,6.2302 C18.56,5.6002 18.05,5.0902 17.42,5.0902 L16.26,5.0902 L16.26,3.4602 L18.62,3.4602 C19.487,3.4602 20.19,4.1632 20.19,5.0302 L20.19,19.6202 C20.19,20.4872 19.487,21.1902 18.62,21.1902 L18.62,21.1902 Z" id="Fill-5" fill="#6EF9DE"></path>
+                <path d="M8.5101,2.5398 L15.6801,2.5398 C16.3151,2.5398 16.8301,3.0548 16.8301,3.6898 L16.8301,4.6398 C16.8301,5.2748 16.3151,5.7898 15.6801,5.7898 L8.5101,5.7898 C7.8751,5.7898 7.3601,5.2748 7.3601,4.6398 L7.3601,3.6898 C7.3601,3.0548 7.8751,2.5398 8.5101,2.5398" id="Fill-7" fill="#6EF9DE"></path>
+                <path d="M16.3299,8.5398 C16.3299,9.0398 16.1299,9.2898 15.7199,9.2898 L9.8299,9.2898 C9.4299,9.2898 9.2199,9.0398 9.2199,8.5398 C9.2199,8.0398 9.4299,7.7998 9.8299,7.7998 L15.7199,7.7998 C16.1299,7.7998 16.3299,8.0498 16.3299,8.5398" id="Fill-9" fill="#6EF9E1"></path>
+                <path d="M7.7,7.8098 L7.71,7.8098 C8.118,7.8098 8.45,8.1418 8.45,8.5498 L8.45,8.5598 C8.45,8.9688 8.118,9.2998 7.71,9.2998 L7.7,9.2998 C7.291,9.2998 6.96,8.9688 6.96,8.5598 L6.96,8.5498 C6.96,8.1418 7.291,7.8098 7.7,7.8098" id="Fill-11" fill="#6DF8E1"></path>
+                <path d="M16.3299,12.2698 C16.3299,12.7698 16.0499,13.0198 15.4799,13.0198 L10.0799,13.0198 C9.5099,13.0198 9.2199,12.7698 9.2199,12.2698 C9.2199,11.7698 9.5099,11.5198 10.0799,11.5198 L15.4799,11.5198 C16.0499,11.5198 16.3299,11.7698 16.3299,12.2698" id="Fill-13" fill="#6EF9E1"></path>
+                <path d="M7.7,11.5598 L7.71,11.5598 C8.118,11.5598 8.45,11.8918 8.45,12.2998 L8.45,12.3098 C8.45,12.7188 8.118,13.0498 7.71,13.0498 L7.7,13.0498 C7.291,13.0498 6.96,12.7188 6.96,12.3098 L6.96,12.2998 C6.96,11.8918 7.291,11.5598 7.7,11.5598" id="Fill-15" fill="#6DF8E1"></path>
+                <path d="M16.3299,16.0198 C16.3299,16.5198 16.1299,16.7698 15.7199,16.7698 L9.8299,16.7698 C9.4299,16.7698 9.2199,16.5198 9.2199,16.0198 C9.2199,15.5198 9.4299,15.2698 9.8299,15.2698 L15.7199,15.2698 C16.1299,15.2698 16.3299,15.5198 16.3299,16.0198" id="Fill-17" fill="#6EF9E1"></path>
+                <path d="M7.7,15.2898 L7.71,15.2898 C8.118,15.2898 8.45,15.6218 8.45,16.0298 L8.45,16.0398 C8.45,16.4488 8.118,16.7798 7.71,16.7798 L7.7,16.7798 C7.291,16.7798 6.96,16.4488 6.96,16.0398 L6.96,16.0298 C6.96,15.6218 7.291,15.2898 7.7,15.2898" id="Fill-19" fill="#6DF8E1"></path>
+            </g>
+        </g>
+    </g>
+</g>
+</svg>`
+
+// TODO 放到 tech-container 里
+// let icon = '' 
+// switch (icon) {
+//     case 'menuIcon': return IconMenuOnly;
+//     case 'stackIcon': return IconTriple;
+//     case 'zhejiaoMenuListIcon': return IconMenu1;
+//     case 'trendAnalysisIcon': return IconTrend;
+//     case 'alertMenuIcon': return IconPCTriple;
+//     case 'lightHatIcon': return IconSafetyHat;
+//     case 'menuAnalysisIcon': return IconMenuSearch;
+//     case 'alertWarningIcon': return IconPCAlert;
+// }

src/views/QualityManager/mockData.js

@@ -52,11 +52,19 @@ export const qualityDatalist = [
   { 'wsName': '工序2', 'pl': '产线8', 'content': '成思体高原法厂清', 'creator': '林平', 'time': '1990-09-18 03:16:44', 'priority': 2 },
   { 'wsName': '工序3', 'pl': '产线6', 'content': '社色增设长放统展', 'creator': '叶静', 'time': '1970-12-02 09:44:01', 'priority': 4 },
   { 'wsName': '工序4', 'pl': '产线10', 'content': '今西', 'creator': '罗磊', 'time': '2017-10-21 00:00:27', 'priority': 2 },
-  { 'wsName': '工序5', 'pl': '产线4', 'content': '却称老节再始', 'creator': '郝秀兰', 'time': '2018-06-04 20:34:53', 'priority': 5 },
+  { 'wsName': '工序5', 'pl': '产线4', 'content': '却称老节再始', 'creator': '郝秀兰', 'time': '2018-06-04 20:34:53', 'priority': 1 },
   { 'wsName': '工序6', 'pl': '产线4', 'content': '志矿正算片大料水断特', 'creator': '熊磊', 'time': '1999-07-20 19:13:32', 'priority': 3 },
   { 'wsName': '工序7', 'pl': '产线3', 'content': '目式却属采精国', 'creator': '马磊', 'time': '2001-07-16 03:50:54', 'priority': 4 },
   { 'wsName': '工序8', 'pl': '产线7', 'content': '做较代你', 'creator': '曾敏', 'time': '1986-01-07 03:20:21', 'priority': 3 },
-  { 'wsName': '工序9', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 2 }
+  { 'wsName': '工序9', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 2 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 3 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 4 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 2 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 1 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 1 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 1 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 3 },
+  { 'wsName': '工序11', 'pl': '产线3', 'content': '与子专前求农说', 'creator': '谭艳', 'time': '1978-07-29 22:49:11', 'priority': 2 }
 ]
 
 /** 质量异常报警 */
@@ -70,7 +78,7 @@ const StatusComponent = {
     statusColor() {
       const colors = [
         '#67ff55',
-        'green',
+        '#e0e0e0',
         '#ffb70c',
         '#0b58ff',
         '#ff0c0c'
@@ -102,19 +110,26 @@ export const qualityExceptionTableProps = [
   { label: '发现人', prop: 'creator', align: 'center', width: 100 },
   { label: '时间', prop: 'time', align: 'center' },
   { label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent, width: 100 },
-  { label: '处理人', prop: 'charger', align: 'center', width: 100 },
-  { label: '完成情况', prop: 'status', align: 'center', subcomponent: StatusComponent, width: 100 }
+  // { label: '处理人', prop: 'charger', align: 'center', width: 100 },
+  // { label: '完成情况', prop: 'status', align: 'center', subcomponent: StatusComponent, width: 150 }
 ]
 
 export const qualityExceptionDatalist = [
   { 'wsName': '工序0', 'pl': '产线1', 'content': '说红要称或各眼华家书', 'creator': '罗霞', 'time': '2013-04-08 15:23:55', 'priority': 1, 'charger': '冯敏', 'status': 4 },
-  { 'wsName': '工序1', 'pl': '产线9', 'content': '积已反老支人后条办', 'creator': '龚芳', 'time': '1984-06-22 09:44:24', 'priority': 1, 'charger': '万静', 'status': 2 },
+  { 'wsName': '工序1', 'pl': '产线9', 'content': '积已反老支人后条办', 'creator': '龚芳', 'time': '1984-06-22 09:44:24', 'priority': 2, 'charger': '万静', 'status': 2 },
   { 'wsName': '工序2', 'pl': '产线10', 'content': '铁收王', 'creator': '黎艳', 'time': '2006-10-25 19:20:41', 'priority': 2, 'charger': '徐秀兰', 'status': 1 },
-  { 'wsName': '工序3', 'pl': '产线10', 'content': '过又条政理质系', 'creator': '郝强', 'time': '2020-03-06 12:11:52', 'priority': 5, 'charger': '白秀兰', 'status': 5 },
+  { 'wsName': '工序3', 'pl': '产线10', 'content': '过又条政理质系', 'creator': '郝强', 'time': '2020-03-06 12:11:52', 'priority': 3, 'charger': '白秀兰', 'status': 2 },
   { 'wsName': '工序4', 'pl': '产线3', 'content': '特适院', 'creator': '魏超', 'time': '1982-12-26 16:19:57', 'priority': 1, 'charger': '姚静', 'status': 3 },
   { 'wsName': '工序5', 'pl': '产线1', 'content': '快准很问无', 'creator': '于桂英', 'time': '1976-09-26 21:53:11', 'priority': 4, 'charger': '白刚', 'status': 2 },
   { 'wsName': '工序6', 'pl': '产线7', 'content': '研开', 'creator': '何桂英', 'time': '1977-04-23 05:34:45', 'priority': 3, 'charger': '秦涛', 'status': 4 },
   { 'wsName': '工序7', 'pl': '产线2', 'content': '四取各广水儿强想华', 'creator': '唐军', 'time': '1988-03-11 22:40:42', 'priority': 2, 'charger': '龙艳', 'status': 1 },
   { 'wsName': '工序8', 'pl': '产线7', 'content': '样无商口', 'creator': '高娟', 'time': '2012-03-14 06:40:16', 'priority': 3, 'charger': '沈涛', 'status': 1 },
-  { 'wsName': '工序9', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 4, 'charger': '侯磊', 'status': 4 }
+  { 'wsName': '工序9', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 4, 'charger': '侯磊', 'status': 4 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 2, 'charger': '侯磊', 'status': 3 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 1, 'charger': '侯磊', 'status': 1 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 1, 'charger': '侯磊', 'status': 2 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 2, 'charger': '侯磊', 'status': 3 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 3, 'charger': '侯磊', 'status': 2 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 3, 'charger': '侯磊', 'status': 1 },
+  { 'wsName': '工序10', 'pl': '产线4', 'content': '克质问般集却片土', 'creator': '谭敏', 'time': '2016-04-14 00:41:46', 'priority': 4, 'charger': '侯磊', 'status': 4 }
 ]

src/views/RoleManager/index.vue

@@ -7,10 +7,7 @@
 -->
 <template>
   <div class="app-container">
-    <head-form
-      :form-config="headFormConfig"
-      @headBtnClick="btnClick"
-    />
+    <head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
     <base-table
       :top-btn-config="topBtnConfig"
       :table-config="tableProps"
@@ -20,16 +17,17 @@
       :limit="listQuery.size"
       @clickTopBtn="clickTopBtn"
     >
-      <method-btn
-        slot="handleBtn"
-        :width="trueWidth"
-        :method-list="tableBtn"
-        @clickBtn="handleClick"
-      />
+      <method-btn slot="handleBtn" :width="trueWidth" :method-list="tableBtn" @clickBtn="handleClick" />
     </base-table>
-    <pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.current"
+      :limit.sync="listQuery.size"
+      @pagination="getList"
+    />
     <add-form :visible.sync="showDialog" @done="getList" />
-    <edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
+    <edit-form :visible.sync="showEditDialog" :target-info="{ id: curEditId }" @done="getList" />
     <menu-empower ref="empowerRef" :visible.sync="empowerDialog" @done="getList" />
   </div>
 </template>
@@ -45,42 +43,46 @@ const topBtnConfig = [
   }
 ]
 // edit here
-const tableBtn = [{
-  type: 'edit',
-  btnName: 'btn.edit'
-}, {
-  type: 'EmPower',
-  btnName: i18n.t('roleManage.roleEmPower')
-}, {
-  type: 'delete',
-  btnName: 'btn.delete'
-}
+const tableBtn = [
+  {
+    type: 'edit',
+    btnName: 'btn.edit'
+  },
+  {
+    type: 'EmPower',
+    btnName: i18n.t('roleManage.roleEmPower')
+  },
+  {
+    type: 'delete',
+    btnName: 'btn.delete'
+  }
+]
+const tableProps = [
+  {
+    prop: 'code',
+    label: i18n.t('roleManage.roleCode')
+  },
+  {
+    prop: 'name',
+    label: i18n.t('roleManage.roleName')
+  },
+  {
+    prop: 'enabled',
+    label: i18n.t('roleManage.status'),
+
+    filter: basicData('enableState')
+  },
+  // {
+  //   prop: 'category',
+  //   label: i18n.t('roleManage.roleType'),
+  //   align: 'center',
+  //   filter: basicData('roleType')
+  // },
+  {
+    prop: 'remark',
+    label: i18n.t('roleManage.remark')
+  }
 ]
-const tableProps = [{
-  prop: 'code',
-  label: i18n.t('roleManage.roleCode'),
-  align: 'center'
-}, {
-  prop: 'name',
-  label: i18n.t('roleManage.roleName'),
-  align: 'center'
-}, {
-  prop: 'enabled',
-  label: i18n.t('roleManage.status'),
-  align: 'center',
-  filter: basicData('enableState')
-},
-// {
-//   prop: 'category',
-//   label: i18n.t('roleManage.roleType'),
-//   align: 'center',
-//   filter: basicData('roleType')
-// },
-{
-  prop: 'remark',
-  label: i18n.t('roleManage.remark'),
-  align: 'center'
-}]
 import AddForm from './AddForm'
 import EditForm from './EditForm'
 import menuEmpower from './menuEmpower'
@@ -193,7 +195,7 @@ export default {
     },
     clickTopBtn(val) {
       if (val === 'add') {
-        this.addNew()// 新增
+        this.addNew() // 新增
       }
     }
   }

src/views/UserPage/=.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>菜单</title>
+    <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="质量追溯_设备参数追溯" transform="translate(-376.000000, -202.000000)" fill-rule="nonzero">
+            <g id="编组-7" transform="translate(376.000000, 200.000000)">
+                <g id="菜单" transform="translate(0.000000, 2.000000)">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect>
+                    <path d="M3.00057813,4.49926562 L13.0025156,4.49926562 C13.2786563,4.49926562 13.5025156,4.27540625 13.5025156,3.99926563 C13.5025156,3.723125 13.2786563,3.49926563 13.0025156,3.49926563 L3.00057813,3.49926563 C2.7244375,3.49926563 2.50057813,3.723125 2.50057813,3.99926563 C2.50057813,4.27540625 2.7244375,4.49926562 3.00057813,4.49926562 Z M3.0004375,8.48703125 L12.9786875,8.48703125 C13.2548281,8.48703125 13.4786875,8.26317187 13.4786875,7.98703125 C13.4786875,7.71089062 13.2548281,7.48703125 12.9786875,7.48703125 L3.0004375,7.48703125 C2.72429687,7.48703125 2.5004375,7.71089062 2.5004375,7.98703125 C2.5004375,8.26317187 2.72429687,8.48703125 3.0004375,8.48703125 Z M13.0025156,11.4969063 L3.00057813,11.4969063 C2.7244375,11.4969063 2.50057813,11.7207656 2.50057813,11.9969063 C2.50057813,12.2730469 2.7244375,12.4969063 3.00057813,12.4969063 L13.0025156,12.4969063 C13.2786563,12.4969063 13.5025156,12.2730469 13.5025156,11.9969063 C13.5025156,11.7207656 13.2786563,11.4969063 13.0025156,11.4969063 L13.0025156,11.4969063 Z" id="形状" fill="#373738"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

src/views/UserPage/TestMenuItem.vue

@@ -0,0 +1,135 @@
+<template>
+  <el-submenu v-if="menuItem.children" :index="constructIndex(menuItem)">
+    <!-- 标题 -->
+    <template slot="title">
+      <!-- <i class="el-icon-menu"></i> -->
+      <i style="line-height: 1;">
+        <svg
+          width="16px"
+          height="16px"
+          viewBox="0 0 16 16"
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+        >
+          <title>菜单</title>
+          <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <g id="质量追溯_设备参数追溯" transform="translate(-376.000000, -202.000000)" fill-rule="nonzero">
+              <g id="编组-7" transform="translate(376.000000, 200.000000)">
+                <g id="菜单" transform="translate(0.000000, 2.000000)">
+                  <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect>
+                  <path
+                    d="M3.00057813,4.49926562 L13.0025156,4.49926562 C13.2786563,4.49926562 13.5025156,4.27540625 13.5025156,3.99926563 C13.5025156,3.723125 13.2786563,3.49926563 13.0025156,3.49926563 L3.00057813,3.49926563 C2.7244375,3.49926563 2.50057813,3.723125 2.50057813,3.99926563 C2.50057813,4.27540625 2.7244375,4.49926562 3.00057813,4.49926562 Z M3.0004375,8.48703125 L12.9786875,8.48703125 C13.2548281,8.48703125 13.4786875,8.26317187 13.4786875,7.98703125 C13.4786875,7.71089062 13.2548281,7.48703125 12.9786875,7.48703125 L3.0004375,7.48703125 C2.72429687,7.48703125 2.5004375,7.71089062 2.5004375,7.98703125 C2.5004375,8.26317187 2.72429687,8.48703125 3.0004375,8.48703125 Z M13.0025156,11.4969063 L3.00057813,11.4969063 C2.7244375,11.4969063 2.50057813,11.7207656 2.50057813,11.9969063 C2.50057813,12.2730469 2.7244375,12.4969063 3.00057813,12.4969063 L13.0025156,12.4969063 C13.2786563,12.4969063 13.5025156,12.2730469 13.5025156,11.9969063 C13.5025156,11.7207656 13.2786563,11.4969063 13.0025156,11.4969063 L13.0025156,11.4969063 Z"
+                    id="形状"
+                    fill="currentColor"
+                  ></path>
+                </g>
+              </g>
+            </g>
+          </g>
+        </svg>
+      </i>
+      <span>{{ menuItem.name }}</span>
+    </template>
+
+    <!-- 主体 -->
+    <template v-for="(submenuItem, idx) in menuItem.children">
+      <TestMenuItem :menuItem="submenuItem" :level="level + 1" />
+    </template>
+  </el-submenu>
+
+  <!-- 一级菜单 -->
+  <el-menu-item v-else :index="constructIndex(menuItem)">
+    <!-- <i v-if="level !== 1" class="el-icon-aim"></i>
+      <i v-else class="el-icon-menu"></i> -->
+    <i style="line-height: 1px" v-if="level !== 1">
+      <svg
+        width="8px"
+        height="8px"
+        viewBox="0 0 8 8"
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+      >
+        <title>椭圆形</title>
+        <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+          <g
+            id="质量追溯_设备参数追溯"
+            transform="translate(-396.000000, -246.000000)"
+            fill="currentColor"
+            fill-rule="nonzero"
+          >
+            <g id="编组-3" transform="translate(396.000000, 240.000000)">
+              <path
+                d="M4,6 C6.209139,6 8,7.790861 8,10 C8,12.209139 6.209139,14 4,14 C1.790861,14 0,12.209139 0,10 C0,7.790861 1.790861,6 4,6 Z M4,7 C2.34314575,7 1,8.34314575 1,10 C1,11.6568542 2.34314575,13 4,13 C5.65685425,13 7,11.6568542 7,10 C7,8.34314575 5.65685425,7 4,7 Z"
+                id="椭圆形"
+              ></path>
+            </g>
+          </g>
+        </g>
+      </svg>
+    </i>
+    <i style="line-height: 1;" v-else>
+      <svg
+        width="16px"
+        height="16px"
+        viewBox="0 0 16 16"
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+      >
+        <title>菜单</title>
+        <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+          <g id="质量追溯_设备参数追溯" transform="translate(-376.000000, -202.000000)" fill-rule="nonzero">
+            <g id="编组-7" transform="translate(376.000000, 200.000000)">
+              <g id="菜单" transform="translate(0.000000, 2.000000)">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect>
+                <path
+                  d="M3.00057813,4.49926562 L13.0025156,4.49926562 C13.2786563,4.49926562 13.5025156,4.27540625 13.5025156,3.99926563 C13.5025156,3.723125 13.2786563,3.49926563 13.0025156,3.49926563 L3.00057813,3.49926563 C2.7244375,3.49926563 2.50057813,3.723125 2.50057813,3.99926563 C2.50057813,4.27540625 2.7244375,4.49926562 3.00057813,4.49926562 Z M3.0004375,8.48703125 L12.9786875,8.48703125 C13.2548281,8.48703125 13.4786875,8.26317187 13.4786875,7.98703125 C13.4786875,7.71089062 13.2548281,7.48703125 12.9786875,7.48703125 L3.0004375,7.48703125 C2.72429687,7.48703125 2.5004375,7.71089062 2.5004375,7.98703125 C2.5004375,8.26317187 2.72429687,8.48703125 3.0004375,8.48703125 Z M13.0025156,11.4969063 L3.00057813,11.4969063 C2.7244375,11.4969063 2.50057813,11.7207656 2.50057813,11.9969063 C2.50057813,12.2730469 2.7244375,12.4969063 3.00057813,12.4969063 L13.0025156,12.4969063 C13.2786563,12.4969063 13.5025156,12.2730469 13.5025156,11.9969063 C13.5025156,11.7207656 13.2786563,11.4969063 13.0025156,11.4969063 L13.0025156,11.4969063 Z"
+                  id="形状"
+                  fill="currentColor"
+                ></path>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    </i>
+    <span slot="title">{{ menuItem.name }}</span>
+  </el-menu-item>
+</template>
+
+<script>
+export default {
+  name: 'TestMenuItem',
+  props: {
+    level: {
+      type: Number,
+      default: 1
+    },
+    index: {
+      type: String,
+      default: ''
+    },
+    menuItem: {
+      default: () => ({})
+    },
+    defaultActive: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {}
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    constructIndex(menuItem) {
+      return menuItem.id + '$--$' + menuItem.name
+    }
+  }
+}
+</script>
+
+<style scoped></style>

src/views/UserPage/TestTree.vue

@@ -0,0 +1,145 @@
+<template>
+  <div class="test-tree">
+    <section class="title-area">
+      <span class="title-icon">
+        <svg
+          width="100%"
+          height="100%"
+          viewBox="0 0 24 24"
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+        >
+          <title>工厂</title>
+          <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <g id="质量追溯_设备参数追溯" transform="translate(-376.000000, -152.000000)" fill-rule="nonzero">
+              <g id="工厂" transform="translate(376.000000, 152.000000)">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="24" />
+                <path
+                  id="形状"
+                  d="M12.25,6.75 L12.25,10.25 L20.75,10.25 L20.75,21.25 L3.25000001,21.25 L3.25000001,6.75 L12.25,6.75 L12.25,6.75 Z M10.75,8.25 L4.75000001,8.25 L4.75000001,19.75 L19.25,19.75 L19.25,11.75 L10.75,11.75 L10.75,8.25 Z M17.5,16.5 L17.5,18 L16,18 L16,16.5 L17.5,16.5 Z M14,16.5 L14,18 L12.5,18 L12.5,16.5 L14,16.5 Z M17.5,13.5 L17.5,15 L16,15 L16,13.5 L17.5,13.5 Z M14,13.5 L14,15 L12.5,15 L12.5,13.5 L14,13.5 Z M8.99999999,10.256 L8.99999999,11.756 L6.49999999,11.756 L6.49999999,10.256 L8.99999999,10.256 Z M9.4755,2.82499999 C10.4715,2.63649998 11.0695,2.739 12.1845,3.291 L12.581,3.49000001 L12.7945,3.58999999 C13.2545,3.79899998 13.532,3.85899998 13.887,3.82849999 L13.9855,3.81850001 L14.1545,3.79249999 L14.2455,3.77650001 C14.8380746,3.66404309 15.3698683,3.34077505 15.7425,2.8665 L15.8205,2.763 L17.0405,3.636 L16.9485,3.76000001 C16.3504031,4.53742507 15.4872916,5.06774928 14.5235,5.25 C13.5275,5.43799999 12.9285,5.3355 11.814,4.7835 L11.4175,4.58500001 C10.781,4.27450001 10.4765,4.20100001 10.024,4.25599999 L9.9315,4.26850001 L9.7545,4.299 C9.16166181,4.41148918 8.62956287,4.73472685 8.25649999,5.20900001 L8.17849999,5.31199999 L6.95899999,4.43800001 L7.0515,4.31449999 C7.64947141,3.53774907 8.51191259,3.00768671 9.47500001,2.82499999 L9.4755,2.82499999 Z"
+                  fill="#0B58FF"
+                />
+              </g>
+            </g>
+          </g>
+        </svg>
+      </span>
+      <span class="title-content">合肥新能源工厂</span>
+    </section>
+    <section class="routes-area" v-if="showList">
+      <el-menu @select="handleSelect">
+        <!-- 此处假设了只有一个根节点 -->
+        <template v-for="(menuItem, index) in menuListTrue[0].children">
+          <TestMenuItem :level="1" :menuItem="menuItem" />
+        </template>
+      </el-menu>
+    </section>
+  </div>
+</template>
+
+<script>
+import TestMenuItem from './TestMenuItem.vue'
+export default {
+  name: 'TestTree',
+  props: {
+    menuList: {
+      type: Array,
+      default: () => []
+    }
+  },
+  components: { TestMenuItem },
+  data() {
+    return {
+      menuListTrue: [],
+      showList: false
+    }
+  },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.reconstructMenuList()
+    })
+  },
+
+  methods: {
+    reconstructMenuList() {
+      this.showList = false
+      this.menuListTrue.splice(0)
+      if (this.menuList) {
+        this.menuList.forEach(item => {
+          if (item.parentId === '-1') {
+            this.menuListTrue.push(item)
+          } else {
+            this.constructMenuList(item)
+          }
+        })
+      }
+
+      this.showList = true
+    },
+    constructMenuList(child) {
+      this.menuList.forEach(item => {
+        if (child.parentId === item.id) {
+          if (!('children' in item)) {
+            this.$set(item, 'children', [])
+          }
+          item.children.push(child)
+        }
+      })
+    },
+    handleSelect(index, indexPath) {
+      const [id, name] = index.split('$--$')
+      this.$emit('getOrganization', { id, name })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.test-tree {
+  height: 100%;
+  padding: 24px 0 0;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.title-area {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 24px;
+}
+
+.routes-area {
+  flex: 1;
+  height: 1px;
+  background-color: #fff;
+  overflow: hidden;
+  overflow-y: auto;
+}
+
+.title-icon {
+  height: 24px;
+  width: 24px;
+}
+
+.title-content {
+  font-size: 16px;
+  line-height: 1;
+}
+
+.routes-area >>> .el-submenu__title,
+.routes-area >>> .el-menu-item {
+  font-size: 14px;
+  line-height: 40px;
+  height: 40px;
+  letter-spacing: 0.88px;
+}
+/* 
+.routes-area >>> .el-submenu__title span,
+.routes-area >>> .el-menu-item span {
+}
+*/
+</style>

src/views/UserPage/o.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="8px" height="8px" viewBox="0 0 8 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>椭圆形</title>
+    <g id="系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="质量追溯_设备参数追溯" transform="translate(-396.000000, -246.000000)" fill="#373738" fill-rule="nonzero">
+            <g id="编组-3" transform="translate(396.000000, 240.000000)">
+                <path d="M4,6 C6.209139,6 8,7.790861 8,10 C8,12.209139 6.209139,14 4,14 C1.790861,14 0,12.209139 0,10 C0,7.790861 1.790861,6 4,6 Z M4,7 C2.34314575,7 1,8.34314575 1,10 C1,11.6568542 2.34314575,13 4,13 C5.65685425,13 7,11.6568542 7,10 C7,8.34314575 5.65685425,7 4,7 Z" id="椭圆形"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/views/UserPage/usermanage.vue

@@ -6,29 +6,36 @@
  * @Description:
 -->
 <template>
-  <div class="app-container">
+  <div class="app-container system-manage-landpage">
     <el-container>
       <el-aside>
-        <side-tree v-if="menuList.length>0" :menu-list="menuList" @getOrganization="getOrganization" />
+        <TestTree v-if="menuList.length > 0" :menu-list="menuList" @getOrganization="getOrganization" />
+        <!-- <side-tree v-if="menuList.length > 0" :menu-list="menuList" @getOrganization="getOrganization" /> -->
       </el-aside>
-      <el-main style="border:2px solid #E4E4E4;border-radius:10px;margin-left:10px">
-        <el-form
-          ref="dataForm"
-          :model="dataForm"
-          :inline="true"
-          size="medium"
-          label-width="100px"
-          label-position="left"
-        >
-          <el-form-item label-width="60px" :label="$t('userManage.orgName')+'：'">
-            <span style="margin: 0 5px;color:#1890FF">{{ dataForm.orgName }}</span>
-          </el-form-item>
-          <el-form-item :label="$t('userManage.userName')+'：'" prop="name">
-            <el-input v-model="dataForm.name" :placeholder="['placeholder.input', $t('userManage.userName')] | i18nFilterForm" clearable :style="{width: '100%'}" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="getList()">{{ 'btn.search' | i18nFilter }}</el-button>
-          </el-form-item>
+      <el-main>
+        <el-form ref="dataForm" :model="dataForm" :inline="true" size="mini" label-position="left">
+          <el-row>
+            <el-col style="margin: 0 0 28px;">
+              <!-- <el-form-item class="has-icon" label-width="100px" :label="$t('userManage.orgName')"> -->
+              <el-form-item class="has-icon">
+                <span v-if="dataForm.orgName">{{ dataForm.orgName }}</span>
+                <span v-else>用户管理</span>
+              </el-form-item>
+            </el-col>
+            <el-col>
+              <el-form-item :label="$t('userManage.userName')" prop="name">
+                <el-input
+                  v-model="dataForm.name"
+                  :placeholder="['placeholder.input', $t('userManage.userName')] | i18nFilterForm"
+                  clearable
+                  :style="{ width: '100%' }"
+                />
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="getList()">{{ 'btn.search' | i18nFilter }}</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
         </el-form>
         <base-table
           :top-btn-config="topBtnConfig"
@@ -47,18 +54,24 @@
             @clickBtn="handleClick"
           />
         </base-table>
-        <pagination v-show="total > 0" :total="total" :page.sync="dataForm.page" :limit.sync="dataForm.limit" @pagination="getList" />
+        <pagination
+          v-show="total > 0"
+          :total="total"
+          :page.sync="dataForm.page"
+          :limit.sync="dataForm.limit"
+          @pagination="getList"
+        />
 
         <add-user-form :visible.sync="showDialog" @refreshDataList="getList" />
-        <edit-user-form :visible.sync="showEditDialog" :target-info="{id: curEditId}" @refreshDataList="getList" />
+        <edit-user-form :visible.sync="showEditDialog" :target-info="{ id: curEditId }" @refreshDataList="getList" />
         <assign-Role :visible.sync="AssignRoleDialog" :user-id="userId" @refreshDataList="getList" />
       </el-main>
     </el-container>
   </div>
-
 </template>
 
 <script>
+import TestTree from './TestTree.vue'
 import sideTree from '../system-manage/sideTree'
 import { getOrgList } from '@/api/org'
 import AddUserForm from './AddUserForm'
@@ -80,71 +93,74 @@ const topBtnConfig = [
   }
 ]
 // edit here
-const tableBtn = [{
-  type: 'edit',
-  btnName: 'btn.edit'
-}, {
-  type: 'EmPower',
-  btnName: i18n.t('userManage.AssignRole')
-}, {
-  type: 'delete',
-  btnName: 'btn.delete'
-}]
+const tableBtn = [
+  {
+    type: 'edit',
+    btnName: 'btn.edit'
+  },
+  {
+    type: 'EmPower',
+    btnName: i18n.t('userManage.AssignRole')
+  },
+  {
+    type: 'delete',
+    btnName: 'btn.delete'
+  }
+]
 // birthday
 // orgId
 // sex
 // code
 // remark
-const tableProps = [{
-  prop: 'name',
-  label: i18n.t('userManage.userName'),
-  align: 'center'
-}, {
-  prop: 'email',
-  label: i18n.t('userManage.email'),
-  align: 'center'
-}, {
-  prop: 'mobile',
-  label: i18n.t('userManage.mobile'),
-  align: 'center'
-},
-// {
-//   prop: 'birthday',
-//   label: i18n.t('userManage.birthday'),
-//   align: 'center'
-// },
-{
-  prop: 'orgName',
-  label: i18n.t('userManage.orgName'),
-  align: 'center'
-},
-{
-  prop: 'roleName',
-  label: i18n.t('roleManage.roleName'),
-  align: 'center'
-},
-// {
-//   prop: 'sex',
-//   label: i18n.t('userManage.sex'),
-//   align: 'center',
-//   filter: dataDict('sex')
-// },
-{
-  prop: 'code',
-  label: i18n.t('userManage.code'),
-  align: 'center'
-}, {
-  prop: 'enabled',
-  label: i18n.t('userManage.status'),
-  align: 'center',
-  filter: dataDict('enableState')
-}, {
-  prop: 'remark',
-  label: i18n.t('userManage.remark'),
-  align: 'center'
-}]
+const tableProps = [
+  {
+    prop: 'name',
+    label: i18n.t('userManage.userName')
+  },
+  {
+    prop: 'email',
+    label: i18n.t('userManage.email')
+  },
+  {
+    prop: 'mobile',
+    label: i18n.t('userManage.mobile')
+  },
+  // {
+  //   prop: 'birthday',
+  //   label: i18n.t('userManage.birthday'),
+  //
+  // },
+  {
+    prop: 'orgName',
+    label: i18n.t('userManage.orgName')
+  },
+  {
+    prop: 'roleName',
+    label: i18n.t('roleManage.roleName')
+  },
+  // {
+  //   prop: 'sex',
+  //   label: i18n.t('userManage.sex'),
+  //
+  //   filter: dataDict('sex')
+  // },
+  {
+    prop: 'code',
+    label: i18n.t('userManage.code')
+  },
+  {
+    prop: 'enabled',
+    label: i18n.t('userManage.status'),
+
+    filter: dataDict('enableState')
+  },
+  {
+    prop: 'remark',
+    label: i18n.t('userManage.remark')
+  }
+]
 export default {
-  components: { sideTree, Pagination, BaseTable, MethodBtn, AddUserForm, EditUserForm, AssignRole },
+  components: { TestTree, sideTree, Pagination, BaseTable, MethodBtn, AddUserForm, EditUserForm, AssignRole },
   data() {
     return {
       topBtnConfig,
@@ -174,16 +190,20 @@ export default {
         current: 1,
         size: 20
       },
-      sexOptions: [{
-        'label': '全部',
-        'value': ''
-      }, {
-        'label': '男',
-        'value': 1
-      }, {
-        'label': '女',
-        'value': 2
-      }]
+      sexOptions: [
+        {
+          label: '全部',
+          value: ''
+        },
+        {
+          label: '男',
+          value: 1
+        },
+        {
+          label: '女',
+          value: 2
+        }
+      ]
     }
   },
   created() {
@@ -206,6 +226,7 @@ export default {
       const res1 = await getOrgList(params)
       if (res1.code === 0) {
         this.menuList = res1.data.records
+        console.log('menulist===>', this.menuList)
       }
     },
     getOrganization(data) {
@@ -220,7 +241,7 @@ export default {
             confirmButtonText: i18n.t('btn.confirm'),
             cancelButtonText: i18n.t('btn.cancel'),
             type: 'warning'
-          }).then(async() => {
+          }).then(async () => {
             // 走接口
             const result = await delUser({
               id: raw.data.id
@@ -266,19 +287,117 @@ export default {
     },
     clickTopBtn(val) {
       if (val === 'add') {
-        this.showDialog = true// 新增
+        this.showDialog = true // 新增
       }
     }
   }
 }
 </script>
 <style scoped>
-.el-container >>> .el-aside{
-  border:2px solid #E4E4E4;
-  border-radius:10px;
-  background-color: white;
-  min-height:550px;
-  width:30%;
-  padding-top:20px
+.el-container >>> .el-aside {
+  border-radius: 8px;
+  background-color: #fff;
+  width: 256px !important;
+  margin: 0;
+  padding-left: 0;
+  padding-right: 0;
+}
+aside {
+  padding: 0;
+}
+.el-container >>> .el-main {
+  border-radius: 8px;
+  background-color: #fff;
+  border: unset;
+}
+.el-container >>> .el-tree-node__content {
+  padding-left: 16px !important;
+  padding-right: 16px !important;
+}
+.el-container >>> .el-tree-node__content:hover {
+  background-color: #e3efff;
+}
+.el-container >>> .el-tree-node:focus > .el-tree-node__content {
+  background-color: #e3efff;
+}
+/* .el-container >>> .el-icon-caret-right {
+  display: inline-block;
+  width: 4px;
+  height: 4px;
+  border-radius: 50%;
+  border: 1px solid #000;
+  background-color: transparent;
+} */
+.el-container >>> .el-icon-caret-right::before {
+  /* content: '';
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  border: 1px solid #000;
+  background-color: transparent; */
+}
+
+.system-manage-landpage {
+  background: unset;
+  padding: 0;
+  display: flex;
+}
+
+.el-container {
+  display: flex;
+  gap: 8px;
+}
+
+.el-container >>> .el-tree-node__label {
+  font-size: 14px;
+  line-height: 20px;
+  letter-spacing: 0.88px;
+  color: #161616;
+}
+
+.has-icon {
+  position: relative;
+  width: 100%;
+  display: flex;
+  align-items: center;
+}
+
+.has-icon::before {
+  content: '';
+  width: 4px;
+  border-radius: 2px;
+  height: 55%;
+  position: absolute;
+  /* top: 13%; */
+  left: 0;
+  background: #0b58ff;
+}
+
+:not(.has-icon) >>> .el-form-item__label {
+  font-size: 14px;
+}
+
+.has-icon >>> .el-form-item__label {
+  position: relative;
+  left: 12px;
+  font-size: 16px;
+}
+.has-icon >>> .el-form-item__content {
+  font-size: 16px;
+  margin-left: 12px;
+}
+
+.el-button--mini {
+  padding: 6px 12px;
+  border-radius: 4px;
+}
+/* .has-icon >>> .el-form-item__content {
+  position: absolute;
+  left: 24px;
+} */
+
+.el-form-item {
+  margin: 0;
 }
 </style>

src/views/material-manage/cockpit/components/baseContainer/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
 -->
 <template>
-  <div class="base-container" :style="{height: height * beilv + 'px', fontSize: 12 * beilv + 'px'}">
+  <div class="base-container" :style="{fontSize: 12 * beilv + 'px'}">
     <div class="line" />
     <div class="line line-vertical" />
     <div class="line line-right" />
@@ -75,6 +75,7 @@ export default {
 .base-container {
   color: #fff;
   width: 100%;
+  height: 100%;
   background-color: rgba($color: #061027, $alpha: 0.15);
   position: relative;
   border: 2px solid;
@@ -138,8 +139,11 @@ export default {
     font-size: 1.5em;
     padding: .67em;
   }
-  // .bar-content{
-  //   padding: 1em;
-  // }
+  .bar-item {
+    height: 100%;
+  }
+  .bar-content{
+    height: calc(100% - 4em);
+  }
 }
 </style>

src/views/material-manage/cockpit/components/baseTable.vue

@@ -7,26 +7,29 @@
 -->
 <template>
   <div class="visual-base-table-container">
-    <el-table
-      v-loading="isLoading"
-      :header-cell-style="{background:'rgba(32, 55, 96, 0.8)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}"
-      :row-style="setRowStyle"
-      :data="renderData"
-      border
-      style="width: 100%; background: transparent"
-    >
-      <el-table-column v-if="page && limit && showIndex" prop="_pageIndex" :label="'tableHeader.index' | i18nFilter" :width="70 * beilv" align="center" />
+    <el-table v-loading="isLoading" class="techy-el-table" :data="renderData" border height="100%">
       <el-table-column
-        v-for="item in renderTableHeadList"
+        v-if="page && limit && showIndex"
+        prop="_pageIndex"
+        :label="'tableHeader.index' | i18nFilter"
+        :width="70 * beilv"
+        align="center"
+      />
+      <el-table-column
+        v-for="(item, index) in renderTableHeadList"
         :key="item.prop"
         :show-overflow-tooltip="showOverflow"
         v-bind="item"
       >
         <template slot-scope="scope">
-
-          <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
+          <component
+            :is="item.subcomponent"
+            v-if="item.subcomponent"
+            :key="index"
+            :inject-data="{ ...scope.row, ...item }"
+            @emitData="emitData"
+          />
           <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-
         </template>
       </el-table-column>
       <slot name="content" />
@@ -36,7 +39,7 @@
 <script>
 import { isObject, isString } from 'lodash'
 export default {
-  name: 'BaseTable',
+  name: 'TechyTable',
   filters: {
     commonFilter: (source, filterType = a => a) => {
       return filterType(source)
@@ -107,70 +110,103 @@ export default {
   methods: {
     emitData(val) {
       this.$emit('emitFun', val)
-    },
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(14, 32, 62, 0.8)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      } else {
-        return {
-          background: 'rgba(32, 55, 96, 0.8)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      }
-    },
-    setCellStyle(v) {
-      return {
-        lineHeight: 23 * this.beilv + 'px'
-      }
     }
   }
 }
 </script>
-<style lang="scss">
-@import "~@/styles/index.scss";
+
+<style scoped>
+.visual-base-table-container >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
+/* .visual-base-table-container {
+  min-width: 30vw;
+} */
 .visual-base-table-container {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
+  height: 100%;
 }
-.setting {
-  text-align: right;
-  padding: 15px;
-  .setting-box {
-    width: 100px;
-  }
-  i {
-    color: #aaa;
-    @extend .pointer;
-  }
+/* .visual-base-table-container >>> .el-table {
+  min-width: 120%;
+} */
+/* 清除默认样式 */
+.visual-base-table-container >>> th.gutter {
+  display: none;
+}
+.visual-base-table-container >>> table {
+  background: transparent;
 }
 
+.visual-base-table-container >>> .el-table,
+.visual-base-table-container >>> th,
+.visual-base-table-container >>> tr {
+  background: unset;
+}
+
+/* 设置设计稿样式 */
+.visual-base-table-container >>> .el-table::before,
+.visual-base-table-container >>> .el-table--group::after,
+.visual-base-table-container >>> .el-table--border::after,
+.visual-base-table-container >>> .el-table--border::after {
+  background: unset;
+}
+
+.visual-base-table-container >>> table * {
+  border-color: #0d1728;
+  border-width: calc(1px * var(--beilv));
+}
+
+.visual-base-table-container >>> td {
+  padding: calc(5px * var(--beilv));
+}
+
+.visual-base-table-container >>> td span {
+  color: #ffffffb3;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+}
+
+.visual-base-table-container >>> thead th {
+  padding: 0;
+}
+
+.visual-base-table-container >>> thead th .cell {
+  color: #fff;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  padding: calc(6px * var(--beilv));
+  white-space: nowrap;
+}
+
+.visual-base-table-container >>> .el-table__body tr:hover > td {
+  background-color: #42537130;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(odd) {
+  background-color: #0e203e;
+  /* background-color: #0e203e90; */
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(even),
+.visual-base-table-container >>> .el-table thead {
+  background-color: #203760;
+  /* background-color: #20376090; */
+}
 </style>

src/views/material-manage/cockpit/components/bomList.vue

@@ -1,8 +1,8 @@
 <template>
-  <div :style="{ padding: 8 * beilv + 'px ' + 24 * beilv + 'px '+ 24 * beilv + 'px' }" class="box">
+  <div :style="{ padding: 8 * beilv + 'px ' + 24 * beilv + 'px 0'}" class="box">
     <div v-for="(item, i) in bomMsg" :key="i" class="bom-box" :style="{ marginBottom: 11 * beilv + 'px'}">
-      <img src="./../../../../assets/img/cockpit/bom.png" alt="" :width="355 * beilv + 'px'" :height="280 * beilv + 'px'">
-      <p class="bom-name" :style="{ bottom: 10 * beilv + 'px', fontSize: 16 * beilv + 'px'}">
+      <img src="./../../../../assets/img/cockpit/bom.png" alt="" width="100%" height="97%"/>
+      <p class="bom-name" :style="{ fontSize: 16 * beilv + 'px'}">
         <span class="leftTriangle" />
         <span>{{ item.name }}</span>
         <span class="rightTriangle" />
@@ -28,14 +28,19 @@ export default {
 <style lang="scss" scoped>
 .box {
   display: flex;
+  flex: 1;
+  height: 100%;
+  width: 100%;
   flex-flow: row wrap;
   justify-content: space-between;
   .bom-box {
     position: relative;
+    width: 48%;
     .bom-name {
       position: absolute;
       width: 100%;
       text-align: center;
+      bottom: 6%;
       .leftTriangle,
       .rightTriangle {
         display: inline-block;

src/views/material-manage/cockpit/index.vue

@@ -29,32 +29,15 @@
           <bom-list :beilv="beilv" :bom-msg="bomMsg" />
         </base-container>
       </el-col>
-      <el-col :span="14">
+      <el-col :span="14" :style="{ margin: 16 * beilv + 'px' + ' 0' }">
         <!-- 右上 -->
-        <el-row>
-          <el-col :style="{ marginTop: 16 * beilv + 'px' }">
-            <base-container :beilv="beilv" :height="470" :title="'在途原片'" :title-icon="'cockpit_2_2'">
-              <div class="box-padding specil-table1">
-                <base-table
-                  :page="1"
-                  :limit="14"
-                  :show-index="false"
-                  :beilv="beilv"
-                  :table-config="originalFilm"
-                  :table-data="originalFilmList"
-                />
-              </div>
-            </base-container>
-          </el-col>
-        </el-row>
-        <!-- 右下 -->
-        <el-row>
-          <el-col :style="{ margin: 16 * beilv + 'px' + ' 0' }">
+        <div class="right-box">
+          <div class="right-top">
             <base-container :beilv="beilv" :height="470" :title="'在途辅料'" :title-icon="'cockpit_2_3'">
               <div class="box-padding specil-table1">
                 <base-table
                   :page="1"
-                  :limit="14"
+                  :limit="15"
                   :show-index="false"
                   :beilv="beilv"
                   :table-config="material"
@@ -62,8 +45,22 @@
                 />
               </div>
             </base-container>
-          </el-col>
-        </el-row>
+          </div>
+          <div class="right-bottom">
+            <base-container :beilv="beilv" :height="470" :title="'深加工再制品'" :title-icon="'cockpit_2_2'">
+              <div class="box-padding specil-table1">
+                <base-table
+                  :page="1"
+                  :limit="15"
+                  :show-index="false"
+                  :beilv="beilv"
+                  :table-config="originalFilm"
+                  :table-data="originalFilmList"
+                />
+              </div>
+            </base-container>
+          </div>
+        </div>
       </el-col>
     </el-row>
   </div>
@@ -178,14 +175,15 @@ export default {
     getMsg() {
       const arr = []
       const temp = []
+      const productList = ['2.0-1128*1716', '2.0-1128*2251', '2.0-1128*2272', '3.2-1128*1716', '3.2-1128*1718','3.2-1032*1747', '3.2-1033*2089']
       for (let i = 0; i < 20; i++) {
         const obj = {}
-        const sj = parseInt(Math.random() * 200)
-        obj.time = moment().add(sj, 'days').add(sj, 'hours').add(sj, 'minute').add(sj, 'second').format('YYYY-MM-DD HH:mm:ss')
-        obj.productLine = '产线A'
-        obj.spec = '光伏玻璃2.0'
-        obj.batch = moment().subtract(sj, 'days').format('YYYYMMDD') + '0000' + parseInt(Math.random() * 89 + 10)
-        obj.num = parseInt(Math.random() * 800 + 100)
+        const sj = parseInt(Math.random() * 14 + 1)
+        obj.time = moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYY-MM-DD HH:mm:ss')
+        obj.productLine = sj % 2 ? 'A' : 'B'
+        obj.spec = productList[parseInt(Math.random() * (productList.length))]
+        obj.batch = moment().subtract(sj, 'days').format('YYYYMMDD')
+        obj.num = parseInt(Math.random() * 800 + 100) + ' (片)'
         arr.push(obj)
       }
       this.originalFilmList = arr
@@ -203,12 +201,12 @@ export default {
       }
       this.materialList = temp
       this.bomMsg = [
-        { name: '隔离纸' },
-        { name: '异丙醇' },
-        { name: '镀膜液' },
-        { name: '磨轮' },
-        { name: '包装辅材' },
-        { name: '网板' }
+        { name: '2.0-1128*1716' },
+        { name: '2.0-1128*2251' },
+        { name: '2.0-1128*2272' },
+        { name: '3.2-1128*1716' },
+        { name: '3.2-1128*1718' },
+        { name: '3.2-1032*1747' }
       ]
     },
     change() {
@@ -256,12 +254,31 @@ export default {
     }
   }
   .box-padding {
-    padding: 0 16px;
+    padding: 0 16px 16px;
+    height: 100%;
   }
 }
 </style>
 <style lang="scss">
 .material-cockpit {
+  .container-main {
+    height: calc(100vh - 100px * var(--beilv));
+    display: flex;
+    flex: 1;
+  }
+  .right-box {
+    height: 100%;
+    display: flex;
+    // flex: 1;
+    flex-direction: column-reverse;
+    justify-content: space-between;
+  }
+  .right-top {
+    height: 49.4%;
+  }
+  .right-bottom {
+    height: 49.4%;
+  }
   .specil-table1 {
     .el-table .cell {
       padding-left: 40px;

src/views/orderManage/orderManagerCockpit/cockpit.vue

@@ -24,7 +24,7 @@
     </el-row>
     <el-row class="container-main">
       <!-- 上 -->
-      <el-row :style="{ padding: '0 ' + 9 * beilv + 'px' }" :gutter="16 * beilv">
+      <el-row :style="{ padding: '0 ' + 9 * beilv + 'px' }" :gutter="16 * beilv" class="top-container">
         <el-col :span="10">
           <base-container :beilv="beilv" :height="412" :title="'工单一览表'" :title-icon="'cockpit_1_1'">
             <work-order :beilv="beilv" :order-msg="orderList" />
@@ -46,13 +46,13 @@
         </el-col>
       </el-row>
       <!-- 下 -->
-      <el-row :style="{ padding: '0 ' + 9 * beilv + 'px' }">
+      <el-row :style="{ padding: '0 ' + 9 * beilv + 'px' }" class="bottom-container">
         <el-col :style="{ margin: 16 * beilv + 'px' + ' 0' }" :span="24">
           <base-container :beilv="beilv" :height="520" :title="'在途/完成订单监控'" :title-icon="'cockpit_1_3'">
             <div class="box-padding specil-table2">
               <base-table
                 :page="1"
-                :limit="16"
+                :limit="17"
                 :show-index="false"
                 :beilv="beilv"
                 :table-config="orderMonitiring"
@@ -76,17 +76,17 @@ const orderPool = [
   {
     prop: 'customerName',
     label: '客户名称',
-    minWidth: 35.2
+    minWidth: 38
   },
   {
     prop: 'orderCode',
     label: '订单编号',
-    minWidth: 32
+    minWidth: 36
   },
   {
     prop: 'productName',
     label: '产品名称',
-    minWidth: 32
+    minWidth: 30
   },
   {
     prop: 'planNum',
@@ -96,31 +96,31 @@ const orderPool = [
   {
     prop: 'planDelivery',
     label: '计划交货期',
-    minWidth: 28.8
+    minWidth: 25
   },
   {
     prop: 'status',
     label: '订单状态',
     subcomponent: orderStatus,
-    minWidth: 19
+    minWidth: 21
   }
 ]
 const orderMonitiring = [
   {
     prop: 'customerName',
     label: '客户名称',
-    minWidth: 35.2
+    minWidth: 40
   },
   {
     prop: 'orderCode',
     label: '订单编号',
-    minWidth: 33.2
+    minWidth: 38
   },
   {
     prop: 'status',
     label: '订单状态',
     subcomponent: orderStatus,
-    minWidth: 27
+    minWidth: 28
   },
   {
     prop: 'completion',
@@ -206,40 +206,55 @@ export default {
   },
   methods: {
     getMsg() {
-      this.orderList = [
-        { code: 'ZGD20221024000110', state: '激活', name: '光伏玻璃2.0', line: 'A', workCode: '20221024000110', percentage: '100%' },
-        { code: 'ZGD20221028000157', state: '激活', name: '光伏玻璃2.0', line: 'A', workCode: '20221028000157', percentage: '85%' },
-        { code: 'ZGD20221030000142', state: '激活', name: '光伏玻璃2.0', line: 'A', workCode: '20221030000142', percentage: '72%' },
-        { code: 'ZGD20221030000098', state: '激活', name: '光伏玻璃2.0', line: 'A', workCode: '20221030000098', percentage: '46%' }
-      ]
-      const compList = ['SHABO沙玻', 'KIBING旗滨', '金晶玻璃', '济南金昊', '东莞佳美特', '汇中矿产', '文盛新材料', '西点化学', '开源塑胶', '奥驰商贸', '竹中科技', '程龙玻璃']
-      const arr = []
+      const compList = ['隆基绿能科技股份有限公司', '天合光能股份有限公司', '晶澳太阳能科技股份有限公司', '晶科能源股份有限公司', '阿特斯阳光电力集团', '东方日升新能源股份有限公司', '尚德集团', '浙江正泰新能源开发有限公司', '环晟光伏(江苏)有限公司', '江苏赛拉弗光伏系统有限公司', '唐山海泰新能科技股份有限公司', '阳光能源控股有限公司', '横店集团东磁股份有限公司', '常州亿晶光电科技有限公司', '协鑫集成科技股份有限公司', '苏州中来光伏新材股份有限公司', '中节能太阳能科技(镇江)有限公司', '苏州腾晖光伏技术有限公司', '英利绿色能源控股有限公司', '湖南红太阳新能源科技有限公司']
+      const productList = ['2.0-1128*1716', '2.0-1128*2251', '2.0-1128*2272', '3.2-1128*1716', '3.2-1128*1718','3.2-1032*1747', '3.2-1033*2089']
+      const daping = [{name: '3.2-1032*1747', percentage: '72%'},{name: '2.0-1128*1716', percentage: '67%'},{name: '3.2-1128*1716', percentage: '46%'},{name: '2.0-1128*2251', percentage: '89%'}]
+      const arr1 = []
+      const arr2 = []
       const temp = []
-      for (let i = 0; i < 20; i++) {
-        const obj = {}
+      for(let i = 0; i < 4; i++) {
         const sj = parseInt(Math.random() * 200)
-        obj.customerName = compList[parseInt(Math.random() * (compList.length))]
-        obj.orderCode = moment().subtract(sj, 'days').format('YYYYMMDD') + '0000' + parseInt(Math.random() * 89 + 10)
-        obj.productName = '光伏玻璃2.0'
-        obj.planNum = parseInt(Math.random() * 800 + 100)
-        obj.planDelivery = moment().add(sj, 'days').format('YYYY-MM-DD')
-        obj.status = parseInt(Math.random() * 3 + 1)
-        arr.push(obj)
+        const obj = {}
+        obj.code = 'WOD' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
+        obj.state = '激活'
+        obj.name = daping[i].name
+        obj.line = sj % 2 ? 'A' : 'B'
+        obj.workCode = 'ODFG' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
+        obj.percentage = daping[i].percentage
+        arr1.push(obj)
       }
-      this.orderPoolList = arr
+      this.orderList = arr1
       for (let i = 0; i < 20; i++) {
         const obj = {}
         const sj = parseInt(Math.random() * 200)
         obj.customerName = compList[parseInt(Math.random() * (compList.length))]
-        obj.orderCode = moment().subtract(sj, 'days').format('YYYYMMDD') + '0000' + parseInt(Math.random() * 89 + 10)
+        obj.orderCode = 'ODFG' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
+        obj.productName = productList[parseInt(Math.random() * (productList.length))]
+        obj.planNum = parseInt(Math.random() * 800 + 100) + '(m²)'
+        obj.planDelivery = moment().add(sj, 'days').format('YYYY-MM-DD')
+        // obj.status = parseInt(Math.random() * 3 + 1)
+        obj.status = 4
+        arr2.push(obj)
+      }
+      this.orderPoolList = arr2
+      for (let i = 0; i < 20; i++) {
+        const obj = {}
+        const sj = parseInt(Math.random() * 200)
+        obj.customerName = compList[parseInt(Math.random() * (compList.length))]
+        obj.orderCode = 'ODFG' + moment().subtract(sj, 'days').subtract(sj, 'hours').subtract(sj, 'minute').subtract(sj, 'second').format('YYYYMMDDHHmmss')
         obj.status = parseInt(Math.random() * 3 + 1)
         obj.completion = obj.status === 1 ? '0.00%' : (obj.status === 3 ? '100%' : parseInt(Math.random() * 100) + '%')
         obj.yield = parseInt(Math.random() * 50 + 50) + '%'
-        obj.shiftCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
-        obj.energyCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
-        obj.equipmentCost = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
-        obj.materialCost = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
-        obj.totalCost = parseInt(obj.shiftCosts + obj.energyCosts + obj.equipmentCost + obj.materialCost).toFixed(2)
+        // obj.shiftCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
+        // obj.energyCosts = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
+        // obj.equipmentCost = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
+        // obj.materialCost = obj.status === 1 ? parseInt(0).toFixed(2) : parseInt(Math.random() * 800 + 100).toFixed(2)
+        // obj.totalCost = parseInt(obj.shiftCosts + obj.energyCosts + obj.equipmentCost + obj.materialCost).toFixed(2)
+        obj.shiftCosts = '0'
+        obj.energyCosts = '0'
+        obj.equipmentCost = '0'
+        obj.materialCost = '0'
+        obj.totalCost = '0'
         temp.push(obj)
       }
       this.orderMonitiringList = temp
@@ -290,9 +305,20 @@ export default {
   }
   .container-main {
     padding: 16px 8px;
+    .top-container {
+      height: calc((100vh - 100px * var(--beilv)) * 0.42);
+      display: flex;
+      flex: 1;
+    }
+    .bottom-container {
+      height: calc((100vh - 100px * var(--beilv)) * 0.56);
+      display: flex;
+      flex: 1;
+    }
   }
   .box-padding {
     padding: 0 16px;
+    height: 100%;
   }
 }
 </style>
@@ -310,11 +336,11 @@ export default {
   }
   .specil-table2 {
     .el-table .cell {
-      padding-left: 50px;
+      padding-left: 25px;
     }
     .el-table--border th:first-child .cell,
     .el-table--border td:first-child .cell {
-      padding-left: 50px;
+      padding-left: 25px;
     }
   }
 }

src/views/orderManage/orderManagerCockpit/components/baseContainer/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
 -->
 <template>
-  <div class="base-container" :style="{height: height * beilv + 'px', fontSize: 12 * beilv + 'px'}">
+  <div class="base-container" :style="{fontSize: 12 * beilv + 'px'}">
     <div class="line" />
     <div class="line line-vertical" />
     <div class="line line-right" />
@@ -75,6 +75,7 @@ export default {
 .base-container {
   color: #fff;
   width: 100%;
+  height: 100%;
   background-color: rgba($color: #061027, $alpha: 0.15);
   position: relative;
   border: 2px solid;
@@ -138,8 +139,11 @@ export default {
     font-size: 1.5em;
     padding: .67em;
   }
-  // .bar-content{
-  //   padding: 1em;
-  // }
+  .bar-item {
+    height: 100%;
+  }
+  .bar-content{
+    height: calc(100% - 6em);
+  }
 }
 </style>

src/views/orderManage/orderManagerCockpit/components/baseTable.vue

@@ -7,26 +7,29 @@
 -->
 <template>
   <div class="visual-base-table-container">
-    <el-table
-      v-loading="isLoading"
-      :header-cell-style="{background:'rgba(32, 55, 96, 0.8)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}"
-      :row-style="setRowStyle"
-      :data="renderData"
-      border
-      style="width: 100%; background: transparent"
-    >
-      <el-table-column v-if="page && limit && showIndex" prop="_pageIndex" :label="'tableHeader.index' | i18nFilter" :width="70 * beilv" align="center" />
+    <el-table v-loading="isLoading" class="techy-el-table" :data="renderData" border height="100%">
       <el-table-column
-        v-for="item in renderTableHeadList"
+        v-if="page && limit && showIndex"
+        prop="_pageIndex"
+        :label="'tableHeader.index' | i18nFilter"
+        :width="70 * beilv"
+        align="center"
+      />
+      <el-table-column
+        v-for="(item, index) in renderTableHeadList"
         :key="item.prop"
         :show-overflow-tooltip="showOverflow"
         v-bind="item"
       >
         <template slot-scope="scope">
-
-          <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
+          <component
+            :is="item.subcomponent"
+            v-if="item.subcomponent"
+            :key="index"
+            :inject-data="{ ...scope.row, ...item }"
+            @emitData="emitData"
+          />
           <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-
         </template>
       </el-table-column>
       <slot name="content" />
@@ -36,7 +39,7 @@
 <script>
 import { isObject, isString } from 'lodash'
 export default {
-  name: 'BaseTable',
+  name: 'TechyTable',
   filters: {
     commonFilter: (source, filterType = a => a) => {
       return filterType(source)
@@ -107,70 +110,103 @@ export default {
   methods: {
     emitData(val) {
       this.$emit('emitFun', val)
-    },
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(14, 32, 62, 0.8)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      } else {
-        return {
-          background: 'rgba(32, 55, 96, 0.8)',
-          color: 'rgba(255,255,255,0.5)',
-          height: 26 * this.beilv + 'px',
-          lineHeight: 26 * this.beilv + 'px',
-          padding: 0,
-          fontSize: 12 * this.beilv + 'px'
-        }
-      }
-    },
-    setCellStyle(v) {
-      return {
-        lineHeight: 23 * this.beilv + 'px'
-      }
     }
   }
 }
 </script>
-<style lang="scss">
-@import "~@/styles/index.scss";
+
+<style scoped>
+.visual-base-table-container >>> ::-webkit-scrollbar {
+  width: calc(8px * var(--beilv));
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-track {
+  background-color: #14243f;
+  border-radius: 0;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-button {
+  width: calc(8px * var(--beilv));
+  height: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+  position: relative;
+}
+
+.visual-base-table-container >>> ::-webkit-scrollbar-thumb {
+  border-radius: calc(8px * var(--beilv));
+  background: #5bc4bf9f;
+}
+
+/* .visual-base-table-container {
+  min-width: 30vw;
+} */
 .visual-base-table-container {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
+  height: 100%;
 }
-.setting {
-  text-align: right;
-  padding: 15px;
-  .setting-box {
-    width: 100px;
-  }
-  i {
-    color: #aaa;
-    @extend .pointer;
-  }
+/* .visual-base-table-container >>> .el-table {
+  min-width: 120%;
+} */
+/* 清除默认样式 */
+.visual-base-table-container >>> th.gutter {
+  display: none;
+}
+.visual-base-table-container >>> table {
+  background: transparent;
 }
 
+.visual-base-table-container >>> .el-table,
+.visual-base-table-container >>> th,
+.visual-base-table-container >>> tr {
+  background: unset;
+}
+
+/* 设置设计稿样式 */
+.visual-base-table-container >>> .el-table::before,
+.visual-base-table-container >>> .el-table--group::after,
+.visual-base-table-container >>> .el-table--border::after,
+.visual-base-table-container >>> .el-table--border::after {
+  background: unset;
+}
+
+.visual-base-table-container >>> table * {
+  border-color: #0d1728;
+  border-width: calc(1px * var(--beilv));
+}
+
+.visual-base-table-container >>> td {
+  padding: calc(5px * var(--beilv));
+}
+
+.visual-base-table-container >>> td span {
+  color: #ffffffb3;
+  font-size: calc(12px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+}
+
+.visual-base-table-container >>> thead th {
+  padding: 0;
+}
+
+.visual-base-table-container >>> thead th .cell {
+  color: #fff;
+  font-size: calc(14px * var(--beilv));
+  line-height: calc(14px * var(--beilv));
+  padding: calc(6px * var(--beilv));
+  white-space: nowrap;
+}
+
+.visual-base-table-container >>> .el-table__body tr:hover > td {
+  background-color: #42537130;
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(odd) {
+  background-color: #0e203e;
+  /* background-color: #0e203e90; */
+}
+
+.visual-base-table-container >>> .el-table tbody tr:nth-child(even),
+.visual-base-table-container >>> .el-table thead {
+  background-color: #203760;
+  /* background-color: #20376090; */
+}
 </style>

src/views/orderManage/orderManagerCockpit/components/orderStatus.vue

@@ -1,9 +1,5 @@
 <template>
-  <div :style="{ height: 15 * beilv + 'px' }">
-    <span v-if="this.injectData.status === 3">
-      <svg-icon icon-class="green_dot" style="font-size: 14px; position: relative; top: .08em" />
-      已完成
-    </span>
+  <div class="state-box">
     <span v-if="this.injectData.status === 1">
       <svg-icon icon-class="yellow_dot" style="font-size: 14px; position: relative; top: .08em" />
       在途
@@ -12,6 +8,14 @@
       <svg-icon icon-class="blue_dot" style="font-size: 14px; position: relative; top: .08em" />
       已下发
     </span>
+    <span v-if="this.injectData.status === 3">
+      <svg-icon icon-class="green_dot" style="font-size: 14px; position: relative; top: .08em" />
+      已完成
+    </span>
+    <span v-if="this.injectData.status === 4">
+      <svg-icon icon-class="orange_dot" style="font-size: 14px; position: relative; top: .08em" />
+      待下发
+    </span>
   </div>
 </template>
 <script>
@@ -40,3 +44,8 @@ export default {
   }
 }
 </script>
+<style scoped>
+.state-box {
+  height: 15px;
+}
+</style>

src/views/orderManage/orderManagerCockpit/components/workOrder.vue

@@ -1,8 +1,13 @@
 <template>
   <div class="order-box" :style="{ padding: '0 ' + 16 * beilv + 'px', fontSize: 14 * beilv + 'px'}">
     <!-- 小块 -->
-    <div v-for="(item,index) in orderMsg" :key="index" :style="{ padding: 10 * beilv + 'px ' + 20 * beilv + 'px ' + 16 * beilv + 'px ' + 16 * beilv
-    + 'px', height: 168 * beilv + 'px'}" class="box">
+    <div
+      v-for="(item,index) in orderMsg"
+      :key="index"
+      :style="{ padding: 10 * beilv + 'px ' + 20 * beilv + 'px ' + 16 * beilv + 'px ' + 16 * beilv
+        + 'px'}"
+      class="box"
+    >
       <p class="line1">
         <span>工单编号：<span class="light-color">{{ item.code }}</span></span>
         <span class="fr">
@@ -52,6 +57,8 @@ export default {
 <style lang='scss' scoped>
 .order-box {
   display: flex;
+  flex: 1;
+  height: 100%;
   flex-flow: row wrap;
   justify-content: space-between;
   .box {

src/views/report-manage/ReportSort/index.vue

@@ -7,7 +7,6 @@
 -->
 <template>
   <div class="app-container">
-    <top-title />
     <head-form
       :form-config="headFormConfig"
       @headBtnClick="btnClick"
@@ -45,11 +44,16 @@ const tableBtn = [{
   btnName: 'btn.delete'
 }]
 const tableProps = [{
+  prop: '',
+  label: '',
+  width: 700
+}, {
   prop: 'name',
-  label: i18n.t('module.formManage.formSort.name'),
-  align: 'center'
+  label: i18n.t('module.formManage.formSort.name')
 }]
-import TopTitle from '@/components/TopTitle'
+
+let resizeEventListener = null
+
 import HeadForm from '@/components/basicData/HeadForm'
 import AddForm from './AddForm'
 import EditForm from './EditForm'
@@ -61,7 +65,7 @@ import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
 import i18n from '@/lang'
 export default {
   name: 'OrgManager',
-  components: { TopTitle, HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
+  components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
   props: {},
   data() {
     return {
@@ -100,7 +104,15 @@ export default {
     this.getList()
     // this.listLoading = false
   },
-  mounted() {},
+  mounted() {
+    this.$set(this.tableProps[0], 'width', 700 * (document.body.offsetWidth / 1920))
+    addEventListener('resize', resizeEventListener = () => {
+      this.$set(this.tableProps[0], 'width', 700 * (document.body.offsetWidth / 1920))
+    })
+  },
+  destroyed() {
+    removeEventListener('resize', resizeEventListener)
+  },
   methods: {
     handleClick(raw) {
       console.log(raw)