From 5af1c027a05f215b3f49b8306ea7f8d1cf15ac7d Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@qq.com>
Date: Mon, 8 May 2023 15:52:19 +0800
Subject: [PATCH] update Areaone

---
 src/assets/svgs/blue-bubble.svg        | 18 ++++++
 src/assets/svgs/blue-lightening.svg    | 20 ++++++
 src/assets/svgs/blue-menu.svg          | 20 ++++++
 src/assets/svgs/blue-pc.svg            | 27 ++++++++
 src/assets/svgs/blue-stack.svg         | 14 +++++
 src/assets/svgs/blue-water.svg         | 16 +++++
 src/assets/svgs/orange-clock.svg       | 31 ++++++++++
 src/assets/svgs/orange-fire.svg        | 31 ++++++++++
 src/assets/svgs/orange-sand.svg        | 31 ++++++++++
 src/assets/svgs/orange-tempe.svg       | 31 ++++++++++
 src/components/common/SmallBox2.vue    | 86 +++++++++++++++++++++-----
 src/components/icons/clockSvg.vue      | 80 ++++++++++++++++++++++++
 src/components/icons/fireSvg.vue       | 80 ++++++++++++++++++++++++
 src/components/icons/sandSvg.vue       | 80 ++++++++++++++++++++++++
 src/components/icons/tempSvg.vue       | 80 ++++++++++++++++++++++++
 src/components/isolate-area-1/Area.vue | 33 +++++++---
 src/components/layout/Main.vue         |  2 +-
 17 files changed, 652 insertions(+), 28 deletions(-)
 create mode 100644 src/assets/svgs/blue-bubble.svg
 create mode 100644 src/assets/svgs/blue-lightening.svg
 create mode 100644 src/assets/svgs/blue-menu.svg
 create mode 100644 src/assets/svgs/blue-pc.svg
 create mode 100644 src/assets/svgs/blue-stack.svg
 create mode 100644 src/assets/svgs/blue-water.svg
 create mode 100644 src/assets/svgs/orange-clock.svg
 create mode 100644 src/assets/svgs/orange-fire.svg
 create mode 100644 src/assets/svgs/orange-sand.svg
 create mode 100644 src/assets/svgs/orange-tempe.svg
 create mode 100644 src/components/icons/clockSvg.vue
 create mode 100644 src/components/icons/fireSvg.vue
 create mode 100644 src/components/icons/sandSvg.vue
 create mode 100644 src/components/icons/tempSvg.vue

diff --git a/src/assets/svgs/blue-bubble.svg b/src/assets/svgs/blue-bubble.svg
new file mode 100644
index 0000000..4a788f8
--- /dev/null
+++ b/src/assets/svgs/blue-bubble.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="44px" height="44px" viewBox="0 0 44 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 15</title>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-93.000000, -855.000000)">
+            <g id="编组-41备份-27" transform="translate(37.000000, 156.000000)">
+                <g id="编组-44备份-10" transform="translate(24.000000, 668.000000)">
+                    <g id="编组-13" transform="translate(32.377358, 31.384615)">
+                        <g id="气体" fill="#000000" fill-rule="nonzero" opacity="0">
+                            <rect id="矩形" x="0" y="0" width="43.1698113" height="43.0769231"></rect>
+                        </g>
+                        <path d="M26.8481565,31.229806 C29.1719688,31.229806 31.0557909,33.1095747 31.0557909,35.4283868 C31.0557909,37.747199 29.1719688,39.6269676 26.8481565,39.6269676 C24.5243443,39.6269676 22.6405222,37.747199 22.6405222,35.4283868 C22.6405222,33.1095747 24.5243443,31.229806 26.8481565,31.229806 Z M11.2734843,21.6482509 C14.902239,21.6482509 17.843926,24.5836082 17.843926,28.204555 C17.843926,31.8255018 14.902239,34.7608591 11.2734843,34.7608591 C7.64472951,34.7608591 4.70304257,31.8255018 4.70304257,28.204555 C4.70304257,24.5836082 7.64472951,21.6482509 11.2734843,21.6482509 Z M27.3856246,3.44995546 C33.5055715,3.44995546 38.4667688,8.40047769 38.4667688,14.5072563 C38.4667688,20.614035 33.5055715,25.5645572 27.3856246,25.5645572 C21.2656777,25.5645572 16.3044805,20.614035 16.3044805,14.5072563 C16.3044805,8.40047769 21.2656777,3.44995546 27.3856246,3.44995546 Z M27.3856246,7.12299471 C23.2986156,7.12299471 19.9854401,10.4290413 19.9854401,14.5072563 C19.9854401,18.5854714 23.2986156,21.891518 27.3856246,21.891518 C31.4726337,21.891518 34.7858092,18.5854714 34.7858092,14.5072563 C34.7858092,10.4290413 31.4726337,7.12299471 27.3856246,7.12299471 Z" id="形状结合" fill="#4DD2FE"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/blue-lightening.svg b/src/assets/svgs/blue-lightening.svg
new file mode 100644
index 0000000..583124d
--- /dev/null
+++ b/src/assets/svgs/blue-lightening.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="44px" height="44px" viewBox="0 0 44 44" 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="德州3" transform="translate(-8022.000000, -1049.000000)" fill-rule="nonzero">
+            <g id="编组-41备份-28" transform="translate(7966.000000, 156.000000)">
+                <g id="编组-10" transform="translate(24.000000, 820.000000)">
+                    <g id="编组-7" transform="translate(13.490566, 73.071429)">
+                        <g id="电,闪电,电力,电量" transform="translate(18.886792, 0.000000)">
+                            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="43.1698113" height="43.2380952"></rect>
+                            <path d="M39.3826843,31.734316 L31.0338235,40.7925454 L33.465735,33.4852707 C33.4932783,33.4008874 33.4317109,33.3148813 33.3426002,33.3148813 L30.9852176,33.3148813 C30.2318273,33.3148813 29.7295671,32.5343352 30.0406444,31.8462862 L33.2453886,24.7840479 C33.4138888,24.4140593 33.7832931,24.175514 34.1899618,24.175514 L40.9882968,24.175514 L37.7819324,29.7967441 C37.7333266,29.8827503 37.794894,29.991475 37.8937258,29.991475 L38.6195729,29.991475 C39.5236412,29.991475 39.9951178,31.0689856 39.3826843,31.734316 Z" id="路径" fill="#4DD2FE"></path>
+                            <path d="M6.95104648,35.9150372 L2.45550602,40.7925454 L3.76499685,36.857859 C3.77982786,36.8124218 3.74667619,36.7661109 3.69869351,36.7661109 L2.42933365,36.7661109 C2.02366194,36.7661109 1.75321414,36.3458168 1.92071729,35.9753289 L3.64634878,32.1725852 C3.73707965,31.9733606 3.93598965,31.8449131 4.15496513,31.8449131 L7.81560705,31.8449131 L6.08910315,34.8717293 C6.06293078,34.9180403 6.09608245,34.9765844 6.1492996,34.9765844 L6.5401403,34.9765844 C7.02694635,34.9765844 7.28081832,35.5567824 6.95104648,35.9150372 Z" id="路径备份" fill="#4DD2FE"></path>
+                            <path d="M35.8701066,1.16731666 L27.9775174,15.0041909 C27.8578723,15.2158983 28.0094228,15.4835283 28.2527012,15.4835283 L30.0394015,15.4835283 C32.2648006,15.4835283 33.4253582,18.1358622 31.9178298,19.7735985 L11.3667877,42.0707786 L17.3530314,24.083641 C17.4208303,23.8759281 17.2692799,23.6642207 17.0499305,23.6642207 L11.2471426,23.6642207 C9.39264331,23.6642207 8.15631048,21.7428765 8.9220392,20.0492175 L16.8106403,2.66524618 C17.22541,1.75450503 18.1347128,1.16731666 19.1357436,1.16731666 L35.8701066,1.16731666 Z M31.4588422,3.38097608 L20.3712741,3.43545996 C19.628085,3.43545996 18.952997,3.87140256 18.6450621,4.54755842 C14.0395702,14.0137115 11.5838416,19.0851592 11.2778762,19.7619016 C10.818928,20.7770152 11.1772009,21.5242546 12.5540252,21.5242546 L12.5540252,21.5242546 L20.3828091,21.5185563 C20.5456593,21.5185563 20.6581739,21.6757329 20.6078384,21.8299439 L20.6078384,21.8299439 L16.4506475,33.467826 L29.222513,18.9529174 C29.9115698,18.2043456 29.5731783,17.4157377 28.7812528,17.4157377 L28.7812528,17.4157377 L24.206406,17.4157377 C24.0257904,17.4157377 23.9132757,17.2170428 24.0021031,17.0598662 L24.0021031,17.0598662 L31.4588422,3.38097608 Z" id="形状结合" fill="#4DD2FE"></path>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/blue-menu.svg b/src/assets/svgs/blue-menu.svg
new file mode 100644
index 0000000..80d5647
--- /dev/null
+++ b/src/assets/svgs/blue-menu.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<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">
+    <title>编组</title>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-2045.000000, -1287.000000)">
+            <g id="编组-41备份-50" transform="translate(2021.000000, 1267.000000)">
+                <g id="编组" transform="translate(24.000000, 20.000000)">
+                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 32 32 32 32 0 0 0"></polygon>
+                    <path d="M21.8532,10.7869333 C21.8532,11.4402667 21.5865333,11.7602667 21.0665333,11.7602667 L13.4665333,11.7602667 C12.9332,11.7602667 12.6798667,11.4402667 12.6798667,10.7869333 C12.6798667,10.1336 12.9332,9.82693333 13.4665333,9.82693333 L21.0665333,9.82693333 C21.5865333,9.82693333 21.8532,10.1469333 21.8532,10.7869333" id="Fill-3" fill="#6EF9E1"></path>
+                    <path d="M19.3466667,15.9333333 C19.3466667,16.5733333 19.08,16.9066667 18.5466667,16.9066667 L13.48,16.9066667 C12.9466667,16.9066667 12.68,16.5733333 12.68,15.9333333 C12.68,15.2933333 12.9466667,14.9733333 13.48,14.9733333 L18.5466667,14.9733333 C19.08,14.9733333 19.3466667,15.2933333 19.3466667,15.9333333" id="Fill-5" fill="#6EF9E1"></path>
+                    <path d="M16.7601333,21.0401333 C16.7601333,21.6801333 16.4934667,22.0001333 15.9468,22.0001333 L13.4934667,22.0001333 C12.9468,22.0001333 12.6801333,21.6801333 12.6801333,21.0401333 C12.6801333,20.4001333 12.9468,20.0801333 13.4934667,20.0801333 L15.9468,20.0801333 C16.4934667,20.0801333 16.7601333,20.4001333 16.7601333,21.0401333" id="Fill-7" fill="#6EF9E1"></path>
+                    <path d="M10.7197333,9.85333333 L10.7197333,9.85333333 C11.2504,9.85333333 11.6797333,10.2826667 11.6797333,10.8133333 C11.6797333,11.344 11.2504,11.7733333 10.7197333,11.7733333 C10.1904,11.7733333 9.75973333,11.344 9.75973333,10.8133333 C9.75973333,10.2826667 10.1904,9.85333333 10.7197333,9.85333333" id="Fill-9" fill="#6DF8E1"></path>
+                    <path d="M10.7197333,15.0265333 L10.7197333,15.0265333 C11.2504,15.0265333 11.6797333,15.4558667 11.6797333,15.9865333 C11.6797333,16.5172 11.2504,16.9465333 10.7197333,16.9465333 C10.1904,16.9465333 9.75973333,16.5172 9.75973333,15.9865333 C9.75973333,15.4558667 10.1904,15.0265333 10.7197333,15.0265333" id="Fill-11" fill="#6DF8E1"></path>
+                    <path d="M10.7197333,20.2002667 L10.7197333,20.2002667 C11.2504,20.2002667 11.6797333,20.6296 11.6797333,21.1602667 C11.6797333,21.6896 11.2504,22.1202667 10.7197333,22.1202667 C10.1904,22.1202667 9.75973333,21.6896 9.75973333,21.1602667 C9.75973333,20.6296 10.1904,20.2002667 10.7197333,20.2002667" id="Fill-13" fill="#6DF8E1"></path>
+                    <path d="M20.7334667,26.3734667 L20.7334667,22.3734667 L24.4534667,22.3734667 L20.7334667,26.3734667 Z M25.6268,12.8668 C25.0521333,12.8668 24.5868,13.3321333 24.5868,13.9068 C24.5868,13.9108 24.5868,13.9161333 24.5868,13.9201333 L24.5868,20.2001333 L19.1734667,20.2001333 C18.8761333,20.2068 18.6401333,20.4494667 18.6401333,20.7468 L18.6401333,26.7068 L8.92013333,26.6134667 C8.12013333,26.6134667 7.45346667,25.4934667 7.45346667,24.6668 L7.45346667,7.7068 C7.45346667,6.8948 8.10813333,6.2348 8.92013333,6.2268 L23.1201333,6.2268 C23.9321333,6.2348 24.5868,6.8948 24.5868,7.7068 L24.5868,10.3734667 C24.5881333,10.9481333 25.0548,11.4121333 25.6281333,11.4108 C26.2014667,11.4108 26.6654667,10.9468 26.6668,10.3734667 L26.6668,6.37346667 C26.6308,5.22413333 25.6961333,4.3068 24.5468,4.29346667 L7.33346667,4.29346667 C6.2068,4.30013333 5.2988,5.22013333 5.30674754,6.3468 L5.40013333,26.7868 C5.39213333,27.9134667 6.30013333,28.8321333 7.4268,28.8401333 L19.7468,28.8401333 L19.8268,28.8401333 L19.9068,28.8401333 L26.3201333,22.7201333 C26.4681333,22.5668 26.5494667,22.3601333 26.5468,22.1468 L26.5468,14.2134667 C26.7108,13.6548 26.3921333,13.0694667 25.8334667,12.9054667 C25.7654667,12.8854667 25.6974667,12.8734667 25.6268,12.8668 L25.6268,12.8668 Z" id="Fill-15" fill="#6DF8E1"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/blue-pc.svg b/src/assets/svgs/blue-pc.svg
new file mode 100644
index 0000000..6ca1a60
--- /dev/null
+++ b/src/assets/svgs/blue-pc.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="33px" height="33px" viewBox="0 0 33 33" 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="德州3" transform="translate(-5351.000000, -1287.000000)">
+            <g id="编组-41备份-49" transform="translate(5319.000000, 1267.000000)">
+                <g id="编组" transform="translate(32.389831, 20.000000)">
+                    <polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 32.2951456 32.3898305 32.2951456 32.3898305 0 0 0"></polygon>
+                    <path d="M19.8119146,10.5498821 L19.8119146,11.3034355 C19.8119146,11.6748297 20.1142197,11.9762511 20.4867028,11.9762511 L20.5001985,11.9762511 C20.8726816,11.9762511 21.1749867,11.6748297 21.1749867,11.3034355 L21.1749867,8.7467365 C21.1749867,8.37534233 20.8726816,8.07392097 20.5001985,8.07392097 L17.9090121,8.07392097 C17.5675693,8.1142899 17.3124994,8.40360058 17.3151985,8.7467365 C17.3111498,9.09121806 17.5662197,9.38591126 17.9090121,9.43300835 L18.6647748,9.43300835 L15.2908341,11.7744064 L13.9412578,9.98471709 C13.6632451,9.65503748 13.1814464,9.58506466 12.8211095,9.82324136 L7.82767733,13.4564452 C7.47408835,13.7174977 7.39986165,14.2140355 7.66032987,14.5665909 C7.66302903,14.5679365 7.6643786,14.5706278 7.66572818,14.573319 C7.82092945,14.78862 8.07330021,14.9151093 8.34051631,14.9097268 C8.50516462,14.9083812 8.66441462,14.8464821 8.78587648,14.7347948 L13.1585036,11.5456491 L14.5080799,13.3353384 C14.7874422,13.6704006 15.2840862,13.7228802 15.6282282,13.4564452 L19.7714273,10.6037074 L19.8119146,10.5498821 Z" id="Fill-3" fill="#6FFADE"></path>
+                    <path d="M22.6190333,23.8852402 C20.4718574,23.8919487 18.7255057,22.1641584 18.7187296,20.0232594 C18.7106604,17.8823604 20.4448659,16.1411138 22.5920417,16.1343575 C24.737868,16.1263118 26.4842197,17.8567934 26.4923172,19.9950012 C26.4923172,20.0044206 26.4923172,20.01384 26.4923172,20.0232594 C26.4774718,22.1493565 24.7527133,23.8704186 22.6190333,23.8852402 M29.4343934,26.5092012 L26.7352409,23.817939 C27.7042367,22.7925682 28.241368,21.4334808 28.2332706,20.0232594 C28.2332706,16.9242711 25.7136117,14.4119779 22.6055375,14.4119779 C19.4974633,14.4119779 16.9778044,16.9242711 16.9778044,20.0232594 C16.9778044,23.1222478 19.4974633,25.634541 22.6055375,25.634541 C23.5461922,25.6237759 24.4733511,25.3882905 25.30469,24.9482691 L28.1118087,27.7471817 C28.2751074,27.9207682 28.5072345,28.0149623 28.7461095,28.0028517 C28.9795862,28.0109254 29.206315,27.9180769 29.3669146,27.7471817 C29.7259019,27.4686361 29.7906816,26.9532594 29.5113193,26.5953216 C29.4883765,26.564372 29.461385,26.5361138 29.4343934,26.5092012" id="Fill-5" fill="#6FFADE"></path>
+                    <path d="M9.43367309,20.6145297 C9.26767521,20.6145297 9.10977479,20.551285 8.98831292,20.4395977 C8.87764767,20.3171452 8.81556716,20.1597064 8.81286801,19.9955394 L8.81286801,16.8211957 C8.78047818,16.5803278 8.89114343,16.3434967 9.09627903,16.2143161 C9.30006504,16.0784074 9.56728114,16.0784074 9.77106716,16.2143161 C9.97620275,16.3434967 10.086868,16.5803278 10.0544782,16.8211957 L10.0544782,19.9955394 C10.051779,20.1637433 9.98430021,20.3225278 9.8655375,20.4395977 C9.74947394,20.5526307 9.59427267,20.6145297 9.43367309,20.6145297" id="Fill-7" fill="#6FFADE"></path>
+                    <path d="M12.4972112,20.6145297 C12.1692642,20.6226035 11.8966498,20.3628967 11.8885523,20.037254 C11.8885523,20.0237977 11.8885523,20.0103414 11.8899019,19.9955394 L11.8899019,14.9642249 C11.9398362,14.6251258 12.2556371,14.3923317 12.5943807,14.44212 C12.8656456,14.4811433 13.077529,14.6950986 13.1180163,14.9642249 L13.1180163,19.9820831 C13.1234146,20.1516326 13.0599845,20.3171452 12.9425714,20.4395977 C12.8211095,20.551285 12.6618595,20.6145297 12.4972112,20.6145297" id="Fill-9" fill="#6FFADE"></path>
+                    <path d="M15.5739752,20.6145297 C15.4079773,20.6145297 15.2500769,20.551285 15.128615,20.4395977 C15.0192994,20.3171452 14.9558693,20.1597064 14.9531701,19.9955394 L14.9531701,17.7887045 C14.9545197,17.4469142 15.2325324,17.1697142 15.5753248,17.1710549 C15.9167676,17.1710549 16.1934307,17.4482598 16.1947803,17.7887045 L16.1947803,19.9955394 C16.1934307,20.1637433 16.1259519,20.3225278 16.0058396,20.4395977 C15.8897761,20.5526307 15.7359244,20.6145297 15.5739752,20.6145297" id="Fill-11" fill="#6FFADE"></path>
+                    <path d="M18.0168432,25.8760817 L3.57637712,25.8760817 C3.0486928,25.9177963 2.65461653,26.3766565 2.69510381,26.9041439 C2.69645339,26.9149089 2.69780297,26.9270196 2.69915254,26.9391303 C2.64516949,27.465272 3.02844915,27.9335517 3.5547839,27.9873769 C3.56288136,27.9873769 3.56962924,27.9887225 3.57637712,27.9887225 L18.0168432,27.9887225 C18.6025593,27.8743439 18.9831398,27.3078332 18.8684258,26.725175 C18.7834025,26.2959186 18.4473581,25.9595109 18.0168432,25.8760817" id="Fill-13" fill="#6FFADE"></path>
+                    <path d="M22.6731513,3.53914427 L6.66717669,3.53914427 C4.43092881,3.53914427 2.61844788,5.3463268 2.61844788,7.57603748 L2.61844788,20.2922511 C2.61844788,22.5206161 4.43092881,24.3291443 6.66717669,24.3291443 L15.5743801,24.3291443 C16.0602275,24.3291443 16.4381089,23.7639792 16.4381089,23.279552 C16.4381089,22.7951249 16.0602275,22.2165035 15.5743801,22.2165035 L7.04505805,22.2165035 C5.78455381,22.2313054 4.75212797,21.226119 4.73728263,19.9692996 C4.73593305,19.9504608 4.73593305,19.9343132 4.73728263,19.9154744 L4.73728263,7.93935786 C4.74403051,6.70137728 5.74946483,5.69888214 6.991075,5.69215398 L22.4572191,5.69215398 C23.7015284,5.69215398 24.7110114,6.69868602 24.7110114,7.93935786 L24.7110114,13.4699016 L24.7110114,13.5910083 C24.702914,13.6219579 24.702914,13.654253 24.7110114,13.6852025 C24.7960347,14.146754 25.1995581,14.4804705 25.6692106,14.4791249 C26.2103907,14.4643229 26.6409055,14.0229559 26.6409055,13.4833579 L26.6409055,7.57603748 C26.6409055,5.37727631 24.8770093,3.58220447 22.6731513,3.53914427" id="Fill-15" fill="#6FFADE"></path>
+                    <path d="M19.8119146,10.5498821 L19.8119146,11.3034355 C19.8119146,11.6748297 20.1142197,11.9762511 20.4867028,11.9762511 L20.5001985,11.9762511 C20.8726816,11.9762511 21.1749867,11.6748297 21.1749867,11.3034355 L21.1749867,8.7467365 C21.1749867,8.37534233 20.8726816,8.07392097 20.5001985,8.07392097 L17.9090121,8.07392097 C17.5675693,8.1142899 17.3124994,8.40360058 17.3151985,8.7467365 C17.3111498,9.09121806 17.5662197,9.38591126 17.9090121,9.43300835 L18.6647748,9.43300835 L15.2908341,11.7744064 L13.9412578,9.98471709 C13.6632451,9.65503748 13.1814464,9.58506466 12.8211095,9.82324136 L7.82767733,13.4564452 C7.47408835,13.7174977 7.39986165,14.2140355 7.66032987,14.5665909 C7.66302903,14.5679365 7.6643786,14.5706278 7.66572818,14.573319 C7.82092945,14.78862 8.07330021,14.9151093 8.34051631,14.9097268 C8.50516462,14.9083812 8.66441462,14.8464821 8.78587648,14.7347948 L13.1585036,11.5456491 L14.5080799,13.3353384 C14.7874422,13.6704006 15.2840862,13.7228802 15.6282282,13.4564452 L19.7714273,10.6037074 L19.8119146,10.5498821 Z" id="Fill-17" fill="#6FFADE"></path>
+                    <path d="M22.6190333,23.8852402 C20.4718574,23.8919487 18.7255057,22.1641584 18.7187296,20.0232594 C18.7106604,17.8823604 20.4448659,16.1411138 22.5920417,16.1343575 C24.737868,16.1263118 26.4842197,17.8567934 26.4923172,19.9950012 C26.4923172,20.0044206 26.4923172,20.01384 26.4923172,20.0232594 C26.4774718,22.1493565 24.7527133,23.8704186 22.6190333,23.8852402 M29.4343934,26.5092012 L26.7352409,23.817939 C27.7042367,22.7925682 28.241368,21.4334808 28.2332706,20.0232594 C28.2332706,16.9242711 25.7136117,14.4119779 22.6055375,14.4119779 C19.4974633,14.4119779 16.9778044,16.9242711 16.9778044,20.0232594 C16.9778044,23.1222478 19.4974633,25.634541 22.6055375,25.634541 C23.5461922,25.6237759 24.4733511,25.3882905 25.30469,24.9482691 L28.1118087,27.7471817 C28.2751074,27.9207682 28.5072345,28.0149623 28.7461095,28.0028517 C28.9795862,28.0109254 29.206315,27.9180769 29.3669146,27.7471817 C29.7259019,27.4686361 29.7906816,26.9532594 29.5113193,26.5953216 C29.4883765,26.564372 29.461385,26.5361138 29.4343934,26.5092012" id="Fill-19" fill="#6FFADE"></path>
+                    <path d="M9.43367309,20.6145297 C9.26767521,20.6145297 9.10977479,20.551285 8.98831292,20.4395977 C8.87764767,20.3171452 8.81556716,20.1597064 8.81286801,19.9955394 L8.81286801,16.8211957 C8.78047818,16.5803278 8.89114343,16.3434967 9.09627903,16.2143161 C9.30006504,16.0784074 9.56728114,16.0784074 9.77106716,16.2143161 C9.97620275,16.3434967 10.086868,16.5803278 10.0544782,16.8211957 L10.0544782,19.9955394 C10.051779,20.1637433 9.98430021,20.3225278 9.8655375,20.4395977 C9.74947394,20.5526307 9.59427267,20.6145297 9.43367309,20.6145297" id="Fill-21" fill="#6FFADE"></path>
+                    <path d="M12.4972112,20.6145297 C12.1692642,20.6226035 11.8966498,20.3628967 11.8885523,20.037254 C11.8885523,20.0237977 11.8885523,20.0103414 11.8899019,19.9955394 L11.8899019,14.9642249 C11.9398362,14.6251258 12.2556371,14.3923317 12.5943807,14.44212 C12.8656456,14.4811433 13.077529,14.6950986 13.1180163,14.9642249 L13.1180163,19.9820831 C13.1234146,20.1516326 13.0599845,20.3171452 12.9425714,20.4395977 C12.8211095,20.551285 12.6618595,20.6145297 12.4972112,20.6145297" id="Fill-23" fill="#6FFADE"></path>
+                    <path d="M15.5739752,20.6145297 C15.4079773,20.6145297 15.2500769,20.551285 15.128615,20.4395977 C15.0192994,20.3171452 14.9558693,20.1597064 14.9531701,19.9955394 L14.9531701,17.7887045 C14.9545197,17.4469142 15.2325324,17.1697142 15.5753248,17.1710549 C15.9167676,17.1710549 16.1934307,17.4482598 16.1947803,17.7887045 L16.1947803,19.9955394 C16.1934307,20.1637433 16.1259519,20.3225278 16.0058396,20.4395977 C15.8897761,20.5526307 15.7359244,20.6145297 15.5739752,20.6145297" id="Fill-25" fill="#6FFADE"></path>
+                    <path d="M18.0168432,25.8760817 L3.57637712,25.8760817 C3.0486928,25.9177963 2.65461653,26.3766565 2.69510381,26.9041439 C2.69645339,26.9149089 2.69780297,26.9270196 2.69915254,26.9391303 C2.64516949,27.465272 3.02844915,27.9335517 3.5547839,27.9873769 C3.56288136,27.9873769 3.56962924,27.9887225 3.57637712,27.9887225 L18.0168432,27.9887225 C18.6025593,27.8743439 18.9831398,27.3078332 18.8684258,26.725175 C18.7834025,26.2959186 18.4473581,25.9595109 18.0168432,25.8760817" id="Fill-27" fill="#6FFADE"></path>
+                    <path d="M22.6731513,3.53914427 L6.66717669,3.53914427 C4.43092881,3.53914427 2.61844788,5.3463268 2.61844788,7.57603748 L2.61844788,20.2922511 C2.61844788,22.5206161 4.43092881,24.3291443 6.66717669,24.3291443 L15.5743801,24.3291443 C16.0602275,24.3291443 16.4381089,23.7639792 16.4381089,23.279552 C16.4381089,22.7951249 16.0602275,22.2165035 15.5743801,22.2165035 L7.04505805,22.2165035 C5.78455381,22.2313054 4.75212797,21.226119 4.73728263,19.9692996 C4.73593305,19.9504608 4.73593305,19.9343132 4.73728263,19.9154744 L4.73728263,7.93935786 C4.74403051,6.70137728 5.74946483,5.69888214 6.991075,5.69215398 L22.4572191,5.69215398 C23.7015284,5.69215398 24.7110114,6.69868602 24.7110114,7.93935786 L24.7110114,13.4699016 L24.7110114,13.5910083 C24.702914,13.6219579 24.702914,13.654253 24.7110114,13.6852025 C24.7960347,14.146754 25.1995581,14.4804705 25.6692106,14.4791249 C26.2103907,14.4643229 26.6409055,14.0229559 26.6409055,13.4833579 L26.6409055,7.57603748 C26.6409055,5.37727631 24.8770093,3.58220447 22.6731513,3.53914427" id="Fill-29" fill="#6FFADE"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/blue-stack.svg b/src/assets/svgs/blue-stack.svg
new file mode 100644
index 0000000..c68ee47
--- /dev/null
+++ b/src/assets/svgs/blue-stack.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<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">
+    <title>物料信息 </title>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-61.000000, -630.000000)" fill-rule="nonzero">
+            <g id="编组-41备份-27" transform="translate(37.000000, 156.000000)">
+                <g id="物料信息-" transform="translate(24.000000, 474.000000)">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="32" height="32"></rect>
+                    <path d="M27.1340562,19.8868718 L27.2783854,19.8953897 C27.7711098,20.2341378 27.9153711,21.4176673 27.3794262,21.8616662 L27.2540486,21.9449122 L16.4637996,27.6043062 C16.2689071,27.72012 15.844494,27.7341843 15.5969272,27.6500248 L15.4897623,27.599776 L4.71366117,22.0242349 C4.17895406,21.6528841 4.18161319,20.6322236 4.50774093,20.098242 L4.58864586,19.9841719 L4.76052226,19.9491281 L15.9888499,25.7501594 L27.1340562,19.8868718 Z M27.1340607,14.9209824 L27.2782702,14.9294236 C27.7710856,15.2675094 27.9153933,16.451219 27.3794309,16.895257 L27.2540486,16.9785088 L16.4637996,22.6379028 C16.2689071,22.7537166 15.844494,22.7677809 15.5969272,22.6836214 L15.4897623,22.6333726 L4.71366117,17.0578315 C4.17895406,16.6864807 4.18161319,15.6658202 4.50774093,15.1318387 L4.58864586,15.0177685 L4.76052226,14.9827247 L15.9888499,20.7835001 L27.1340607,14.9209824 Z M16.5951185,4.44129586 L16.7466996,4.53776848 L27.0905422,9.95729961 C27.1771171,10.0026484 27.2563092,10.0608719 27.3255314,10.1300992 C27.8228324,10.628616 27.8228324,11.4355827 27.325375,11.9342561 L27.2149017,12.0291347 L27.0914584,12.1063085 L16.7381662,17.5426386 C16.3366777,17.8413769 15.8034852,17.8754072 15.3852074,17.6525945 L15.2342215,17.5570156 L4.89202354,12.2149925 C4.80359962,12.1694164 4.72274569,12.1104561 4.65221224,12.0400881 C4.41289556,11.8008069 4.27844588,11.4762506 4.27844588,11.1378307 C4.27844588,10.7994109 4.41289556,10.4748546 4.65214844,10.2356371 L4.76027742,10.1423243 L4.88105566,10.0659349 L15.2365516,4.55200494 C15.639098,4.25071239 16.1751041,4.21639693 16.5951185,4.44129586 Z M16.0042309,6.32957073 L6.99516957,11.1284375 L15.9095761,15.7988086 L24.9797337,11.033355 L16.0042309,6.32957073 Z" id="形状结合" stroke="#6EF9E1" stroke-width="0.5" fill="#77FFF2"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/blue-water.svg b/src/assets/svgs/blue-water.svg
new file mode 100644
index 0000000..a151349
--- /dev/null
+++ b/src/assets/svgs/blue-water.svg
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="44px" height="44px" viewBox="0 0 44 44" 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="德州3" transform="translate(-8022.000000, -701.000000)" fill-rule="nonzero">
+            <g id="编组-41备份-28" transform="translate(7966.000000, 156.000000)">
+                <g id="编组-44备份-9" transform="translate(24.000000, 517.000000)">
+                    <g id="水" transform="translate(32.377358, 28.384615)">
+                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="43.1698113" height="43.0769231"></rect>
+                        <path d="M21.2077369,7.80288987 C19.6851315,9.67759537 18.2264893,11.6031392 16.8343103,13.5762209 C15.7049685,15.1831638 14.6914288,16.7382698 13.8234535,18.2145406 C11.7606594,21.7221686 10.6226594,24.6158536 10.6226594,26.5710755 C10.6226594,33.1705566 15.838628,38.507594 22.2569912,38.507594 C28.6748134,38.507594 33.8913231,33.1705566 33.8913231,26.5710755 C33.8913231,24.6163936 32.7533231,21.7221685 30.690529,18.2145406 C29.8225537,16.7382698 28.809014,15.1831638 27.6796721,13.5762209 C26.2874932,11.6031392 24.828851,9.67759537 23.3062456,7.80288987 C22.9595735,7.37491556 22.6096314,6.94958887 22.2564501,6.526947 C21.9290655,6.91896329 21.5778709,7.34553752 21.2077369,7.80288987 L21.2077369,7.80288987 Z M8.14914634,26.5710755 C8.14914634,24.0575274 9.42026474,20.8252827 11.6897711,16.9650561 C12.5940022,15.427229 13.6432566,13.8170464 14.8088543,12.1593466 C16.2333664,10.1401048 17.7259401,8.16953649 19.2840136,6.2510237 C19.9036867,5.48564932 20.5339856,4.72890202 21.1747278,3.98100087 L21.3262447,3.8071314 L22.2569912,2.74555556 L23.1877378,3.8071314 L23.3392547,3.98100087 C23.4588448,4.12085244 23.5984567,4.28338258 23.7548438,4.46805146 C24.2001952,4.99397965 24.696413,5.59226352 25.2299689,6.2510237 C26.7880424,8.16953649 28.2806161,10.1401048 29.7051282,12.1593466 C30.8707259,13.8170464 31.9194391,15.427229 32.8242114,16.9650561 C35.0937178,20.8252828 36.3648362,24.0575274 36.3648362,26.5710755 C36.3648362,34.519935 30.0552404,40.9763248 22.2569912,40.9763248 C14.458201,40.9763248 8.14914634,34.519935 8.14914634,26.5710755 Z M22.2569912,36.687904 C16.8207821,36.687904 12.4143465,32.2752907 12.4143465,26.8318797 C12.4143465,21.3890087 17.5296646,24.1450021 22.2569912,26.8318797 C27.0037986,29.5300966 32.099636,21.3890087 32.099636,26.8318797 C32.099636,32.2752907 27.6926593,36.687904 22.2564501,36.687904 L22.2569912,36.687904 Z M33.7333584,8.99621774 C33.7333584,8.098252 34.3291444,7.03127649 35.3242856,5.80285076 C35.7944112,5.22484487 36.2974093,4.67425194 36.8307963,4.15379043 L37.2582903,3.74503514 L37.6863255,4.15379043 L37.8205262,4.2850025 C38.3043157,4.76659359 38.7623851,5.27324287 39.1928362,5.80285076 C39.5162072,6.19695756 39.8140729,6.61123256 40.0846213,7.04315582 C40.5321372,7.76833197 40.7837634,8.41521286 40.7837634,8.99621774 C40.7837634,10.9546794 39.2069056,12.5448833 37.2588315,12.5448833 C35.3107573,12.5448833 33.7333584,10.9546794 33.7333584,8.99621774 Z M3.7351045,14.6242976 C3.7351045,13.9525782 4.15610498,13.1987837 4.86065845,12.3288963 C5.185691,11.9293205 5.5334918,11.5487347 5.90233701,11.1890252 L6.32983104,10.7797299 L6.75786624,11.1890252 C7.12651028,11.5485754 7.47412984,11.9289803 7.79900367,12.3283564 C8.038725,12.6242585 8.24814297,12.913141 8.42022287,13.1923041 C8.74219623,13.7144526 8.92509875,14.1847641 8.92509875,14.6242976 C8.92509875,16.0643906 7.76491237,17.2344998 6.3303722,17.2344998 C4.89529091,17.2344998 3.7351045,16.0643905 3.7351045,14.6242976 L3.7351045,14.6242976 Z" id="形状" fill="#4DD2FE"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/orange-clock.svg b/src/assets/svgs/orange-clock.svg
new file mode 100644
index 0000000..dc0e743
--- /dev/null
+++ b/src/assets/svgs/orange-clock.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="95px" height="96px" viewBox="0 0 95 96" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>217时间-线性</title>
+    <defs>
+        <filter x="-25.8%" y="-25.7%" width="151.6%" height="151.3%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FDB764" offset="0%"></stop>
+            <stop stop-color="#F43D0A" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-4344.000000, -314.000000)" fill-rule="nonzero">
+            <g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+                <g id="编组-34" transform="translate(784.000000, 0.000000)">
+                    <g id="217时间-线性" filter="url(#filter-1)" transform="translate(27.872840, 44.857143)">
+                        <path d="M33.9319262,3.40816327 C50.7834641,3.40816327 64.4706597,17.1557464 64.4706597,34.0816327 C64.4706597,51.0075189 50.7834641,64.755102 33.9319262,64.755102 C17.0803883,64.755102 3.39319262,51.0075189 3.39319262,34.0816327 C3.39319262,17.1557464 17.0803883,3.40816327 33.9319262,3.40816327 Z M33.9319262,10.410284 C20.9210568,10.410284 10.364556,21.0133598 10.364556,34.0816327 C10.364556,47.1499055 20.9210568,57.7529813 33.9319262,57.7529813 C46.9427955,57.7529813 57.4992964,47.1499055 57.4992964,34.0816327 C57.4992964,21.0133598 46.9427955,10.410284 33.9319262,10.410284 Z M33.9943323,16.5893931 C36.1014878,16.5893931 37.294554,18.0250541 37.4085928,20.2987273 L37.4176079,20.6646053 L37.4176079,32.6373146 L47.7996741,38.6099304 L48.1371613,38.8810457 C49.2670119,40.1195796 49.4764471,41.6333232 48.7043958,43.1013532 C47.9554526,44.5254441 46.6267694,45.1426923 45.0399954,44.8818614 L44.6961393,44.8125031 L44.3208391,44.6631642 L31.723547,37.3952262 L31.4691351,37.2073286 C31.1913158,36.9490974 30.9752618,36.6336735 30.8199777,36.2739732 C30.7297238,36.064909 30.6469883,35.810393 30.5651985,35.4992832 L30.4834804,35.1688961 L30.4462445,34.8461964 L30.4477968,20.5982938 C30.5631278,18.1363518 31.8076276,16.5893931 33.9943323,16.5893931 Z" id="形状结合" fill="url(#linearGradient-2)"></path>
+                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="67.8638524" height="68.1632653"></rect>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/orange-fire.svg b/src/assets/svgs/orange-fire.svg
new file mode 100644
index 0000000..575612d
--- /dev/null
+++ b/src/assets/svgs/orange-fire.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="94px" height="96px" viewBox="0 0 94 96" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>燃脂</title>
+    <defs>
+        <filter x="-25.8%" y="-25.7%" width="151.6%" height="151.3%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FDB764" offset="0%"></stop>
+            <stop stop-color="#F43D0A" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-3967.000000, -314.000000)" fill-rule="nonzero">
+            <g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+                <g id="编组-32" transform="translate(392.000000, 0.000000)">
+                    <g id="燃脂" filter="url(#filter-1)" transform="translate(42.092717, 44.857143)">
+                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="67.8638524" height="68.1632653"></rect>
+                        <path d="M59.3201924,30.3417546 C59.2328643,31.1095585 59.2328643,31.9431657 59.3201924,32.7985365 L59.3201924,39.2693251 C59.3201924,51.0487911 51.2833045,61.0076722 40.4727817,63.9030945 L40.4727817,60.0206946 C40.4727817,56.3793051 37.5463772,53.4399894 33.9428696,53.4399894 L33.9209828,53.4399894 C30.3174022,53.4399894 27.3691839,56.3793051 27.3691839,60.0206946 L27.3691839,63.9030945 C16.5586611,60.9857621 8.54365996,51.0268077 8.54365996,39.2693251 L8.54365996,28.1701695 C11.4483236,30.539238 15.3357024,34.8605714 15.0954588,40.8271361 C17.5195624,29.5960805 22.3242879,27.9069559 26.3863959,23.2785889 C31.6716085,17.2462942 33.2439526,10.6216223 30.2082603,4.26023736 C43.3556315,8.84478431 46.7625232,26.5689049 45.6705932,35.8915889 C50.4097313,27.4462589 56.3719012,25.1869604 59.3201924,24.5946567 L59.3201924,30.3417546 Z" id="路径" fill="url(#linearGradient-2)"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/orange-sand.svg b/src/assets/svgs/orange-sand.svg
new file mode 100644
index 0000000..a5a1eed
--- /dev/null
+++ b/src/assets/svgs/orange-sand.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="95px" height="96px" viewBox="0 0 95 96" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>沙漏</title>
+    <defs>
+        <filter x="-25.8%" y="-25.7%" width="151.6%" height="151.3%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FDB764" offset="0%"></stop>
+            <stop stop-color="#F43D0A" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-4737.000000, -314.000000)" fill-rule="nonzero">
+            <g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+                <g id="编组-33" transform="translate(1176.000000, 0.000000)">
+                    <g id="沙漏" filter="url(#filter-1)" transform="translate(28.752348, 44.857143)">
+                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="67.8638524" height="68.1632653"></rect>
+                        <path d="M53.1140121,61.7729592 L15.1874544,61.7729592 C13.5828693,61.7729592 12.2700269,60.4543246 12.2700269,58.8426601 L12.2700269,53.1285768 C12.2700269,45.3632842 16.3544254,38.1840514 23.0645087,34.2281476 C16.208554,30.2722438 11.9782841,22.9464961 11.9782841,15.0346885 L11.9782841,9.32060523 C11.9782841,7.70894072 13.2911265,6.39030612 14.8957116,6.39030612 L52.8222693,6.39030612 C54.4268545,6.39030612 55.7396969,7.70894072 55.7396969,9.32060523 L55.7396969,15.0346885 C55.7396969,20.7487717 53.5516262,26.31634 49.4672277,30.4187588 L49.3213563,30.5652737 C48.0085139,31.8839083 46.5498002,33.056028 44.7993437,34.0816327 C46.5498002,35.1072373 48.0085139,36.279357 49.4672277,37.7445065 L49.6130991,37.8910215 C53.5516262,41.9934402 55.8855682,47.5610085 55.8855682,53.2750918 L55.8855682,58.989175 C55.8855682,60.4543246 54.7185972,61.7729592 53.1140121,61.7729592 Z M18.1048819,55.912361 L50.1965846,55.912361 L50.1965846,53.1285768 C50.1965846,48.8796431 48.5919994,44.7772244 45.5287006,41.8469253 L45.3828292,41.7004103 C43.9241154,40.2352608 42.1736589,39.0631411 40.4232024,38.3305664 C39.9855883,38.1840514 39.4021028,37.8910215 38.9644886,37.8910215 C37.7975176,37.4514766 36.9222894,36.4258719 36.9222894,35.1072373 L36.9222894,33.2025429 C36.9222894,31.8839083 37.7975176,30.7117887 38.9644886,30.4187588 C39.4021028,30.2722438 39.8397169,30.1257289 40.1314597,29.9792139 C42.0277875,29.2466391 43.778244,28.0745195 45.2369578,26.6093699 L45.3828292,26.462855 C48.3002567,23.5325559 49.9048418,19.4301371 49.9048418,15.3277184 L49.9048418,12.5439342 L17.8131392,12.5439342 L17.8131392,15.3277184 C17.8131392,21.7743764 21.6057949,27.6349746 27.5865213,30.1257289 C28.0241355,30.2722438 28.607621,30.5652737 29.0452351,30.7117887 C30.2122061,31.1513335 31.0874344,32.3234532 31.0874344,33.4955728 L31.0874344,35.4002672 C31.0874344,36.7189018 30.2122061,37.7445065 29.0452351,38.1840514 C28.607621,38.3305664 28.1700068,38.4770813 27.8782641,38.6235963 C21.8975377,41.1143505 18.1048819,46.9749487 18.1048819,53.4216067 L18.1048819,55.912361 L18.1048819,55.912361 Z M22.4808318,16.4887814 C23.1393478,22.7690213 28.7367339,27.561836 35.1572649,26.9007581 C40.5900219,26.4049497 44.8703759,21.942674 45.5288919,16.4887814 L22.4808318,16.4887814 Z" id="形状" fill="url(#linearGradient-2)"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/assets/svgs/orange-tempe.svg b/src/assets/svgs/orange-tempe.svg
new file mode 100644
index 0000000..c986838
--- /dev/null
+++ b/src/assets/svgs/orange-tempe.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="94px" height="96px" viewBox="0 0 94 96" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 36</title>
+    <defs>
+        <filter x="-25.8%" y="-25.7%" width="151.6%" height="151.3%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+            <stop stop-color="#FDB764" offset="0%"></stop>
+            <stop stop-color="#F43D0A" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="德州3" transform="translate(-3574.000000, -314.000000)" fill-rule="nonzero">
+            <g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+                <g id="温度" filter="url(#filter-1)" transform="translate(41.092717, 44.857143)">
+                    <g id="编组-36">
+                        <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="67.8638524" height="68.1632653"></rect>
+                        <path d="M35.9928243,41.9589127 L35.9928243,23.6751035 C35.9928243,22.563565 35.0915956,21.6583601 33.9849396,21.6583601 L33.8258992,21.6583601 C32.7457501,21.6583601 31.8776547,22.5369414 31.8776547,23.6152002 L31.8776547,41.9589127 C28.8823944,42.8308381 26.6889626,45.5198293 26.6889626,48.7279822 C26.6889626,52.6483184 29.9294101,55.8231917 33.9385528,55.8231917 C37.9410689,55.8231917 41.1815165,52.6416625 41.1815165,48.7279822 C41.1748898,45.5198293 38.981458,42.837494 35.9928243,41.9589127 L35.9928243,41.9589127 Z M46.655156,33.8586594 C46.2045416,33.4859279 45.9394744,32.9800781 45.9394743,32.4609164 L45.9394743,11.7876324 C45.9394743,5.2847996 40.5519817,0 33.9319262,0 C27.3118707,0 21.9243781,5.2847996 21.9243781,11.7876324 L21.9243781,31.8751955 C21.9243781,32.7471209 21.5665372,33.5524871 20.9502558,34.0783047 C16.6097789,37.7590278 14.1247731,43.1037307 14.1247731,48.7346381 C14.1247731,59.4440116 23.011154,68.1632653 33.9385528,68.1632653 C44.8659517,68.1632653 53.7523326,59.4506675 53.7523326,48.7346381 C53.745706,42.9706123 51.1612999,37.5460384 46.655156,33.8586594 Z M33.9319262,61.9932285 C26.4437753,61.9932285 20.360481,56.0428371 20.360481,48.7279822 C20.360481,44.1686777 22.7328333,39.9754489 26.7022159,37.5194148 L27.6630848,36.927038 C27.9745389,36.7340163 28.1667127,36.3879086 28.1667127,36.021833 L28.1667127,11.7876324 C28.1667127,8.68597414 30.7577454,6.16338089 33.9385528,6.16338089 C37.1193603,6.16338089 39.710393,8.68597414 39.710393,11.7876324 L39.710393,36.021833 C39.710393,36.3879086 39.9025668,36.7340163 40.2140209,36.927038 L41.1748898,37.5194148 C45.1442724,39.9754489 47.509998,44.1620218 47.509998,48.7279822 C47.5033713,56.0428371 41.4134503,61.9932285 33.9319262,61.9932285 L33.9319262,61.9932285 Z" id="形状" fill="url(#linearGradient-2)"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/components/common/SmallBox2.vue b/src/components/common/SmallBox2.vue
index 49e0e4d..9eaf2ed 100644
--- a/src/components/common/SmallBox2.vue
+++ b/src/components/common/SmallBox2.vue
@@ -1,6 +1,8 @@
 <template>
 	<div class="small-box-2">
-		<div class="icon"></div>
+		<div class="icon">
+			<component :is="iconComp" />
+		</div>
 		<div class="info">
 			<h2 class="title">{{ title }}</h2>
 			<span class="value">{{ value }}</span>
@@ -9,31 +11,81 @@
 </template>
 
 <script>
+// import tempSvg from "../icons/tempSvg.vue";
+// import fireSvg from "../icons/fireSvg.vue";
+// import sandSvg from "../icons/sandSvg.vue";
+// import clockSvg from "../icons/clockSvg.vue";
+
 export default {
 	name: "SmallBox2",
+	components: {},
 	props: {
-    title: {
-      type: String,
-      default: '车间温度', // 车间温度   当前火向    换火时间   剩余时间
-    },
-    value: {
-      type: String,
-      default: '27℃',
-    }
-  },
-	data() {
-		return {};
+		icon: {
+			type: String,
+			default: "temp",
+		},
+		title: {
+			type: String,
+			default: "车间温度", // 车间温度   当前火向    换火时间   剩余时间
+		},
+		value: {
+			type: String,
+			default: "27℃",
+		},
+	},
+	computed: {
+		// imgURL() {
+		// 	return {
+		// 		temp: () => import("../../assets/svgs/orange-tempe.svg"),
+		// 	}[this.icon];
+		// },
+		iconComp() {
+			return ({
+				temp: () => import('../icons/tempSvg.vue'),
+				fire: () => import('../icons/fireSvg.vue'),
+				sand: () => import('../icons/sandSvg.vue'),
+				clock: () => import('../icons/clockSvg.vue'),
+			})[this.icon]
+		}
 	},
-	created() {},
-	mounted() {},
-	methods: {},
 };
 </script>
 
 <style scoped lang="scss">
+@import "../../assets/styles/functions";
+
 .small-box-2 {
-	padding: 28px;
-	border: 1px solid gray;
+	padding: 14px;
+	// border: 1px solid gray;
+	box-shadow: inset 0 0 15px rgba($color: #fff, $alpha: 0.285);
 	border-radius: 6px;
+	user-select: none;
+	width: w(465px);
+	height: h(200px);
+	display: flex;
+
+	.icon {
+		width: h(128px);
+		height: h(128px);
+	}
+
+	.info {
+		font-family: "微软雅黑", Helvicate, sans-serif;
+
+		h2 {
+			font-size: 16px;
+			opacity: 0.7;
+			// line-height: 12px;
+			letter-spacing: 1px;
+			font-weight: 400;
+			color: hsla(0, 0%, 100%, 0.9);
+		}
+
+		.value {
+			color: #fff;
+			font-size: 30px;
+			line-height: 29px;
+		}
+	}
 }
 </style>
diff --git a/src/components/icons/clockSvg.vue b/src/components/icons/clockSvg.vue
new file mode 100644
index 0000000..53c4028
--- /dev/null
+++ b/src/components/icons/clockSvg.vue
@@ -0,0 +1,80 @@
+<template>
+	<svg
+		width="64px"
+		height="64px"
+		viewBox="0 0 95 96"
+		version="1.1"
+		xmlns="http://www.w3.org/2000/svg"
+		xmlns:xlink="http://www.w3.org/1999/xlink"
+	>
+		<title>217时间-线性</title>
+		<defs>
+			<filter
+				x="-25.8%"
+				y="-25.7%"
+				width="151.6%"
+				height="151.3%"
+				filterUnits="objectBoundingBox"
+				id="filter-1"
+			>
+				<feOffset
+					dx="0"
+					dy="1"
+					in="SourceAlpha"
+					result="shadowOffsetOuter1"
+				></feOffset>
+				<feGaussianBlur
+					stdDeviation="4"
+					in="shadowOffsetOuter1"
+					result="shadowBlurOuter1"
+				></feGaussianBlur>
+				<feColorMatrix
+					values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0"
+					type="matrix"
+					in="shadowBlurOuter1"
+					result="shadowMatrixOuter1"
+				></feColorMatrix>
+				<feMerge>
+					<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+					<feMergeNode in="SourceGraphic"></feMergeNode>
+				</feMerge>
+			</filter>
+			<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+				<stop stop-color="#FDB764" offset="0%"></stop>
+				<stop stop-color="#F43D0A" offset="100%"></stop>
+			</linearGradient>
+		</defs>
+		<g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+			<g
+				id="德州3"
+				transform="translate(-4344.000000, -314.000000)"
+				fill-rule="nonzero"
+			>
+				<g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+					<g id="编组-34" transform="translate(784.000000, 0.000000)">
+						<g
+							id="217时间-线性"
+							filter="url(#filter-1)"
+							transform="translate(27.872840, 44.857143)"
+						>
+							<path
+								d="M33.9319262,3.40816327 C50.7834641,3.40816327 64.4706597,17.1557464 64.4706597,34.0816327 C64.4706597,51.0075189 50.7834641,64.755102 33.9319262,64.755102 C17.0803883,64.755102 3.39319262,51.0075189 3.39319262,34.0816327 C3.39319262,17.1557464 17.0803883,3.40816327 33.9319262,3.40816327 Z M33.9319262,10.410284 C20.9210568,10.410284 10.364556,21.0133598 10.364556,34.0816327 C10.364556,47.1499055 20.9210568,57.7529813 33.9319262,57.7529813 C46.9427955,57.7529813 57.4992964,47.1499055 57.4992964,34.0816327 C57.4992964,21.0133598 46.9427955,10.410284 33.9319262,10.410284 Z M33.9943323,16.5893931 C36.1014878,16.5893931 37.294554,18.0250541 37.4085928,20.2987273 L37.4176079,20.6646053 L37.4176079,32.6373146 L47.7996741,38.6099304 L48.1371613,38.8810457 C49.2670119,40.1195796 49.4764471,41.6333232 48.7043958,43.1013532 C47.9554526,44.5254441 46.6267694,45.1426923 45.0399954,44.8818614 L44.6961393,44.8125031 L44.3208391,44.6631642 L31.723547,37.3952262 L31.4691351,37.2073286 C31.1913158,36.9490974 30.9752618,36.6336735 30.8199777,36.2739732 C30.7297238,36.064909 30.6469883,35.810393 30.5651985,35.4992832 L30.4834804,35.1688961 L30.4462445,34.8461964 L30.4477968,20.5982938 C30.5631278,18.1363518 31.8076276,16.5893931 33.9943323,16.5893931 Z"
+								id="形状结合"
+								fill="url(#linearGradient-2)"
+							></path>
+							<rect
+								id="矩形"
+								fill="#000000"
+								opacity="0"
+								x="0"
+								y="0"
+								width="67.8638524"
+								height="68.1632653"
+							></rect>
+						</g>
+					</g>
+				</g>
+			</g>
+		</g>
+	</svg>
+</template>
diff --git a/src/components/icons/fireSvg.vue b/src/components/icons/fireSvg.vue
new file mode 100644
index 0000000..6c3a0f6
--- /dev/null
+++ b/src/components/icons/fireSvg.vue
@@ -0,0 +1,80 @@
+<template>
+	<svg
+		width="64px"
+		height="64px"
+		viewBox="0 0 94 96"
+		version="1.1"
+		xmlns="http://www.w3.org/2000/svg"
+		xmlns:xlink="http://www.w3.org/1999/xlink"
+	>
+		<title>燃脂</title>
+		<defs>
+			<filter
+				x="-25.8%"
+				y="-25.7%"
+				width="151.6%"
+				height="151.3%"
+				filterUnits="objectBoundingBox"
+				id="filter-1"
+			>
+				<feOffset
+					dx="0"
+					dy="1"
+					in="SourceAlpha"
+					result="shadowOffsetOuter1"
+				></feOffset>
+				<feGaussianBlur
+					stdDeviation="4"
+					in="shadowOffsetOuter1"
+					result="shadowBlurOuter1"
+				></feGaussianBlur>
+				<feColorMatrix
+					values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0"
+					type="matrix"
+					in="shadowBlurOuter1"
+					result="shadowMatrixOuter1"
+				></feColorMatrix>
+				<feMerge>
+					<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+					<feMergeNode in="SourceGraphic"></feMergeNode>
+				</feMerge>
+			</filter>
+			<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+				<stop stop-color="#FDB764" offset="0%"></stop>
+				<stop stop-color="#F43D0A" offset="100%"></stop>
+			</linearGradient>
+		</defs>
+		<g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+			<g
+				id="德州3"
+				transform="translate(-3967.000000, -314.000000)"
+				fill-rule="nonzero"
+			>
+				<g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+					<g id="编组-32" transform="translate(392.000000, 0.000000)">
+						<g
+							id="燃脂"
+							filter="url(#filter-1)"
+							transform="translate(42.092717, 44.857143)"
+						>
+							<rect
+								id="矩形"
+								fill="#000000"
+								opacity="0"
+								x="0"
+								y="0"
+								width="67.8638524"
+								height="68.1632653"
+							></rect>
+							<path
+								d="M59.3201924,30.3417546 C59.2328643,31.1095585 59.2328643,31.9431657 59.3201924,32.7985365 L59.3201924,39.2693251 C59.3201924,51.0487911 51.2833045,61.0076722 40.4727817,63.9030945 L40.4727817,60.0206946 C40.4727817,56.3793051 37.5463772,53.4399894 33.9428696,53.4399894 L33.9209828,53.4399894 C30.3174022,53.4399894 27.3691839,56.3793051 27.3691839,60.0206946 L27.3691839,63.9030945 C16.5586611,60.9857621 8.54365996,51.0268077 8.54365996,39.2693251 L8.54365996,28.1701695 C11.4483236,30.539238 15.3357024,34.8605714 15.0954588,40.8271361 C17.5195624,29.5960805 22.3242879,27.9069559 26.3863959,23.2785889 C31.6716085,17.2462942 33.2439526,10.6216223 30.2082603,4.26023736 C43.3556315,8.84478431 46.7625232,26.5689049 45.6705932,35.8915889 C50.4097313,27.4462589 56.3719012,25.1869604 59.3201924,24.5946567 L59.3201924,30.3417546 Z"
+								id="路径"
+								fill="url(#linearGradient-2)"
+							></path>
+						</g>
+					</g>
+				</g>
+			</g>
+		</g>
+	</svg>
+</template>
diff --git a/src/components/icons/sandSvg.vue b/src/components/icons/sandSvg.vue
new file mode 100644
index 0000000..c53243e
--- /dev/null
+++ b/src/components/icons/sandSvg.vue
@@ -0,0 +1,80 @@
+<template>
+	<svg
+		width="64px"
+		height="64px"
+		viewBox="0 0 95 96"
+		version="1.1"
+		xmlns="http://www.w3.org/2000/svg"
+		xmlns:xlink="http://www.w3.org/1999/xlink"
+	>
+		<title>沙漏</title>
+		<defs>
+			<filter
+				x="-25.8%"
+				y="-25.7%"
+				width="151.6%"
+				height="151.3%"
+				filterUnits="objectBoundingBox"
+				id="filter-1"
+			>
+				<feOffset
+					dx="0"
+					dy="1"
+					in="SourceAlpha"
+					result="shadowOffsetOuter1"
+				></feOffset>
+				<feGaussianBlur
+					stdDeviation="4"
+					in="shadowOffsetOuter1"
+					result="shadowBlurOuter1"
+				></feGaussianBlur>
+				<feColorMatrix
+					values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0"
+					type="matrix"
+					in="shadowBlurOuter1"
+					result="shadowMatrixOuter1"
+				></feColorMatrix>
+				<feMerge>
+					<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+					<feMergeNode in="SourceGraphic"></feMergeNode>
+				</feMerge>
+			</filter>
+			<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+				<stop stop-color="#FDB764" offset="0%"></stop>
+				<stop stop-color="#F43D0A" offset="100%"></stop>
+			</linearGradient>
+		</defs>
+		<g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+			<g
+				id="德州3"
+				transform="translate(-4737.000000, -314.000000)"
+				fill-rule="nonzero"
+			>
+				<g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+					<g id="编组-33" transform="translate(1176.000000, 0.000000)">
+						<g
+							id="沙漏"
+							filter="url(#filter-1)"
+							transform="translate(28.752348, 44.857143)"
+						>
+							<rect
+								id="矩形"
+								fill="#000000"
+								opacity="0"
+								x="0"
+								y="0"
+								width="67.8638524"
+								height="68.1632653"
+							></rect>
+							<path
+								d="M53.1140121,61.7729592 L15.1874544,61.7729592 C13.5828693,61.7729592 12.2700269,60.4543246 12.2700269,58.8426601 L12.2700269,53.1285768 C12.2700269,45.3632842 16.3544254,38.1840514 23.0645087,34.2281476 C16.208554,30.2722438 11.9782841,22.9464961 11.9782841,15.0346885 L11.9782841,9.32060523 C11.9782841,7.70894072 13.2911265,6.39030612 14.8957116,6.39030612 L52.8222693,6.39030612 C54.4268545,6.39030612 55.7396969,7.70894072 55.7396969,9.32060523 L55.7396969,15.0346885 C55.7396969,20.7487717 53.5516262,26.31634 49.4672277,30.4187588 L49.3213563,30.5652737 C48.0085139,31.8839083 46.5498002,33.056028 44.7993437,34.0816327 C46.5498002,35.1072373 48.0085139,36.279357 49.4672277,37.7445065 L49.6130991,37.8910215 C53.5516262,41.9934402 55.8855682,47.5610085 55.8855682,53.2750918 L55.8855682,58.989175 C55.8855682,60.4543246 54.7185972,61.7729592 53.1140121,61.7729592 Z M18.1048819,55.912361 L50.1965846,55.912361 L50.1965846,53.1285768 C50.1965846,48.8796431 48.5919994,44.7772244 45.5287006,41.8469253 L45.3828292,41.7004103 C43.9241154,40.2352608 42.1736589,39.0631411 40.4232024,38.3305664 C39.9855883,38.1840514 39.4021028,37.8910215 38.9644886,37.8910215 C37.7975176,37.4514766 36.9222894,36.4258719 36.9222894,35.1072373 L36.9222894,33.2025429 C36.9222894,31.8839083 37.7975176,30.7117887 38.9644886,30.4187588 C39.4021028,30.2722438 39.8397169,30.1257289 40.1314597,29.9792139 C42.0277875,29.2466391 43.778244,28.0745195 45.2369578,26.6093699 L45.3828292,26.462855 C48.3002567,23.5325559 49.9048418,19.4301371 49.9048418,15.3277184 L49.9048418,12.5439342 L17.8131392,12.5439342 L17.8131392,15.3277184 C17.8131392,21.7743764 21.6057949,27.6349746 27.5865213,30.1257289 C28.0241355,30.2722438 28.607621,30.5652737 29.0452351,30.7117887 C30.2122061,31.1513335 31.0874344,32.3234532 31.0874344,33.4955728 L31.0874344,35.4002672 C31.0874344,36.7189018 30.2122061,37.7445065 29.0452351,38.1840514 C28.607621,38.3305664 28.1700068,38.4770813 27.8782641,38.6235963 C21.8975377,41.1143505 18.1048819,46.9749487 18.1048819,53.4216067 L18.1048819,55.912361 L18.1048819,55.912361 Z M22.4808318,16.4887814 C23.1393478,22.7690213 28.7367339,27.561836 35.1572649,26.9007581 C40.5900219,26.4049497 44.8703759,21.942674 45.5288919,16.4887814 L22.4808318,16.4887814 Z"
+								id="形状"
+								fill="url(#linearGradient-2)"
+							></path>
+						</g>
+					</g>
+				</g>
+			</g>
+		</g>
+	</svg>
+</template>
diff --git a/src/components/icons/tempSvg.vue b/src/components/icons/tempSvg.vue
new file mode 100644
index 0000000..14512d0
--- /dev/null
+++ b/src/components/icons/tempSvg.vue
@@ -0,0 +1,80 @@
+<template>
+	<svg
+		width="64px"
+		height="64px"
+		viewBox="0 0 94 96"
+		version="1.1"
+		xmlns="http://www.w3.org/2000/svg"
+		xmlns:xlink="http://www.w3.org/1999/xlink"
+	>
+		<title>编组 36</title>
+		<defs>
+			<filter
+				x="-25.8%"
+				y="-25.7%"
+				width="151.6%"
+				height="151.3%"
+				filterUnits="objectBoundingBox"
+				id="filter-1"
+			>
+				<feOffset
+					dx="0"
+					dy="1"
+					in="SourceAlpha"
+					result="shadowOffsetOuter1"
+				></feOffset>
+				<feGaussianBlur
+					stdDeviation="4"
+					in="shadowOffsetOuter1"
+					result="shadowBlurOuter1"
+				></feGaussianBlur>
+				<feColorMatrix
+					values="0 0 0 0 0.976470588   0 0 0 0 0.470588235   0 0 0 0 0.207843137  0 0 0 0.54411604 0"
+					type="matrix"
+					in="shadowBlurOuter1"
+					result="shadowMatrixOuter1"
+				></feColorMatrix>
+				<feMerge>
+					<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+					<feMergeNode in="SourceGraphic"></feMergeNode>
+				</feMerge>
+			</filter>
+			<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+				<stop stop-color="#FDB764" offset="0%"></stop>
+				<stop stop-color="#F43D0A" offset="100%"></stop>
+			</linearGradient>
+		</defs>
+		<g id="德州" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+			<g
+				id="德州3"
+				transform="translate(-3574.000000, -314.000000)"
+				fill-rule="nonzero"
+			>
+				<g id="编组-9备份-4" transform="translate(3546.000000, 283.000000)">
+					<g
+						id="温度"
+						filter="url(#filter-1)"
+						transform="translate(41.092717, 44.857143)"
+					>
+						<g id="编组-36">
+							<rect
+								id="矩形"
+								fill="#000000"
+								opacity="0"
+								x="0"
+								y="0"
+								width="67.8638524"
+								height="68.1632653"
+							></rect>
+							<path
+								d="M35.9928243,41.9589127 L35.9928243,23.6751035 C35.9928243,22.563565 35.0915956,21.6583601 33.9849396,21.6583601 L33.8258992,21.6583601 C32.7457501,21.6583601 31.8776547,22.5369414 31.8776547,23.6152002 L31.8776547,41.9589127 C28.8823944,42.8308381 26.6889626,45.5198293 26.6889626,48.7279822 C26.6889626,52.6483184 29.9294101,55.8231917 33.9385528,55.8231917 C37.9410689,55.8231917 41.1815165,52.6416625 41.1815165,48.7279822 C41.1748898,45.5198293 38.981458,42.837494 35.9928243,41.9589127 L35.9928243,41.9589127 Z M46.655156,33.8586594 C46.2045416,33.4859279 45.9394744,32.9800781 45.9394743,32.4609164 L45.9394743,11.7876324 C45.9394743,5.2847996 40.5519817,0 33.9319262,0 C27.3118707,0 21.9243781,5.2847996 21.9243781,11.7876324 L21.9243781,31.8751955 C21.9243781,32.7471209 21.5665372,33.5524871 20.9502558,34.0783047 C16.6097789,37.7590278 14.1247731,43.1037307 14.1247731,48.7346381 C14.1247731,59.4440116 23.011154,68.1632653 33.9385528,68.1632653 C44.8659517,68.1632653 53.7523326,59.4506675 53.7523326,48.7346381 C53.745706,42.9706123 51.1612999,37.5460384 46.655156,33.8586594 Z M33.9319262,61.9932285 C26.4437753,61.9932285 20.360481,56.0428371 20.360481,48.7279822 C20.360481,44.1686777 22.7328333,39.9754489 26.7022159,37.5194148 L27.6630848,36.927038 C27.9745389,36.7340163 28.1667127,36.3879086 28.1667127,36.021833 L28.1667127,11.7876324 C28.1667127,8.68597414 30.7577454,6.16338089 33.9385528,6.16338089 C37.1193603,6.16338089 39.710393,8.68597414 39.710393,11.7876324 L39.710393,36.021833 C39.710393,36.3879086 39.9025668,36.7340163 40.2140209,36.927038 L41.1748898,37.5194148 C45.1442724,39.9754489 47.509998,44.1620218 47.509998,48.7279822 C47.5033713,56.0428371 41.4134503,61.9932285 33.9319262,61.9932285 L33.9319262,61.9932285 Z"
+								id="形状"
+								fill="url(#linearGradient-2)"
+							></path>
+						</g>
+					</g>
+				</g>
+			</g>
+		</g>
+	</svg>
+</template>
diff --git a/src/components/isolate-area-1/Area.vue b/src/components/isolate-area-1/Area.vue
index 73ef634..060944a 100644
--- a/src/components/isolate-area-1/Area.vue
+++ b/src/components/isolate-area-1/Area.vue
@@ -1,9 +1,12 @@
 <template>
 	<DragabbleContainer class="isolate-area-1">
-		<SmallBox2></SmallBox2>
-		<SmallBox2></SmallBox2>
-		<SmallBox2></SmallBox2>
-		<SmallBox2></SmallBox2>
+		<SmallBox2
+			v-for="rd in rdata"
+			:key="rd.icon"
+      :icon="rd.icon"
+			:title="rd.title"
+			:value="rd.value"
+		></SmallBox2>
 	</DragabbleContainer>
 </template>
 
@@ -14,17 +17,27 @@ import SmallBox2 from "../common/SmallBox2.vue";
 export default {
 	name: "IsolateArea--1",
 	components: { DragabbleContainer, SmallBox2 },
+	data() {
+		return {
+			rdata: [
+				{ icon: "temp", title: "车间温度", value: "27℃" },
+				{ icon: "fire", title: "当前火向", value: "东火" },
+				{ icon: "clock", title: "换火时间", value: "12:21:39" },
+				{ icon: "sand", title: "剩余时间", value: "6h" },
+			],
+		};
+	},
 };
 </script>
 
 <style scoped lang="scss">
 .isolate-area-1 {
-  display: flex;
+	display: flex;
 
-  > .small-box-2:not(:last-child) {
-    margin: {
-      right: 8px;
-    }
-  }
+	> .small-box-2:not(:last-child) {
+		margin: {
+			right: 8px;
+		}
+	}
 }
 </style>
diff --git a/src/components/layout/Main.vue b/src/components/layout/Main.vue
index a59d215..7d9453e 100644
--- a/src/components/layout/Main.vue
+++ b/src/components/layout/Main.vue
@@ -26,6 +26,6 @@ export default {
 main {
 	height: 1px;
 	flex: 1;
-	background: #eee2;
+	// background: #eee2;
 }
 </style>