diff --git a/ruoyi-ui/src/assets/icons/svg/100.svg b/ruoyi-ui/src/assets/icons/svg/100.svg
new file mode 100644
index 000000000..54b421bd8
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/100.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="1615815538287" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25670" data-spm-anchor-id="a313x.7781069.0.i53" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M852.149 736.914H171.851c-38.598 0-70-31.401-70-70V234.341c0-38.598 31.402-70 70-70h680.298c38.598 0 70 31.402 70 70v432.573c0 38.599-31.402 70-70 70zM171.851 224.341c-5.514 0-10 4.486-10 10v432.573c0 5.514 4.486 10 10 10h680.298c5.514 0 10-4.486 10-10V234.341c0-5.514-4.486-10-10-10H171.851z" p-id="25671" data-spm-anchor-id="a313x.7781069.0.i52" class="selected" fill="#1D6EFE"></path><path d="M288 605.628c-7.678 0-15.355-2.929-21.213-8.787-11.716-11.716-11.716-30.71 0-42.426l165-165a30 30 0 0 1 42.426 0L552 467.201l162.787-162.787c11.715-11.716 30.711-11.716 42.426 0 11.716 11.716 11.716 30.711 0 42.427l-184 184c-11.715 11.715-30.711 11.715-42.426 0L453 453.054 309.212 596.841c-5.857 5.858-13.535 8.787-21.212 8.787zM724 859.659H300c-16.568 0-30-13.432-30-30s13.432-30 30-30h424c16.568 0 30 13.432 30 30s-13.432 30-30 30z" p-id="25672" data-spm-anchor-id="a313x.7781069.0.i49" class="selected" fill="#1D6EFE"></path></svg>
\ No newline at end of file
diff --git a/ruoyi-ui/src/assets/icons/svg/102.svg b/ruoyi-ui/src/assets/icons/svg/102.svg
new file mode 100644
index 000000000..7f82ad1be
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/102.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="1615815493881" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25162" data-spm-anchor-id="a313x.7781069.0.i41" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M296 876.4c63.2-84.1 197.2-251.5 260.7-335.4l64.8-85.8-39-32.4-38.5-33.1-74 78.1c-72.2 76.6-214.8 236.7-287.2 313.1-18.2 19.2-27.3 43.7-25.6 68.9 2.8 42.3 33.1 67.7 75 63.4 25.2-2.6 47.9-15.7 63.8-36.8zM947.9 383.5c-9.6-8.1-19.3-16.3-29-24.4-10.8-9.1-21.6-18.3-32.3-27.3-3.7-3.2-7.2-4.3-12-3.9-2.5 0.2-25.1 2.5-31.4 3.1l-1.9 0.2c-22.7 1.7-34.3-8.3-36.6-31.5l-0.7-5.8c-0.6-5.1-1.1-10.2-1.3-15.3-0.2-6.8-3-11.9-9.4-17.5-32.8-28.6-71.5-62.5-110-97.3-16.3-14.8-34.9-26.2-56.9-34.9-48.5-19.6-94.3-24-140.1-13.9-22.6 5-43.7 13.4-63.8 25.4-11 6.6-6.6 23.6 6.2 23.8 24.6 0.3 46.8 4.6 68 12.9 49.2 19.3 79.8 60.9 81.6 111.3 0.8 23.2-4 46.2-14.2 68.4 14.5 12.4 29.3 25 43.8 37.5 12.4 10.6 24.5 21 35.7 30.7 12.9-14 15.9-16.7 18.4-18.5 15.7-10.9 34.4-13.4 50.2-6.9 5.1 2.1 10.2 5.3 15 9.4 21.7 18.1 27.4 43.6 15.3 68.6 5 4.1 10.1 8.2 15.1 12.3 20.1 16.6 41.1 33.8 62 49.8 3.1 2.3 5.6 3.6 7.2 3.5 0.8-0.1 3.3-0.7 8-5L926 431.9l24-29.9c4.9-6.3 6.2-11.4-2.1-18.5zM132 322.7c0.4-0.3 0.8-0.6 1.1-1.1 0.1-0.1 0.1-0.2 0.2-0.3 0.3-0.4 0.6-0.8 0.8-1.3 0.5-0.8 1-1.6 1.6-2.4 2.2-3.4 4.5-6.8 6.7-10.2 3-4.6 6.1-9.3 9.1-13.9 3.3-5 6.6-10 9.8-15 3-4.5 5.9-9 8.9-13.5 2.1-3.2 4.1-6.3 6.2-9.5 1.2-1.9 2.5-3.8 2.5-6.1 0-2.7-1.3-5.4-3.6-6.8-1.4-0.9-2.9-1.7-4.3-2.7l-44.2-28.4c-18.1-11.6-33.7-21.7-35.5-22.8l-8.7-5.6c-2.5-1.6-5.8 0.2-5.9 3.2l-0.1 10.4c0 2.7-0.1 5.3-0.2 7.8-0.2 5.4-0.4 10.6 0 15.8 3.4 43.1 15.6 76.8 36.3 100.1 0.5 0.5 0.9 1 1.4 1.6l0.2 0.2c0.1 0.1 0.2 0.2 0.2 0.3 4.3 4.9 12 5.1 17.1 0.5 0.2 0 0.3-0.2 0.4-0.3z" p-id="25163" data-spm-anchor-id="a313x.7781069.0.i38" class="selected" fill="#1D6EFE"></path><path d="M442.8 442.1c-23.7 25.2-55.4 59.7-89.2 96.8-28.7-37.9-60.6-72.8-101.9-97.1-26.9-15.7-56.9-24.4-88-26.3-15.1-0.8-35.4-0.6-43.8-16-6-10.6 7.6-21.8 13-29.9 13.7-20.7 27.2-41.3 40.8-61.9 19.5-29.4 39-58.9 58.5-88.3-7.8-5.5-34.4-22.6-42.8-28.1-21.6-13.8-43.9-28.4-62.7-45.8l-0.9-0.9c-2.9-3.2-3.7-7.9-2.3-11.8 2.5-6.5 9-9.9 27.9-14.7 10-2.6 20.6-4.7 23.1-5.1 20.3-2.4 39.9-2.7 58.4-0.8 30.3 3.4 72.8 14.3 103.6 49l1.3 1.6c17.2 20 29.2 44.5 33.9 70.6 4.6 24.8-4.2 49.6-1.8 74.7 2 20.6 8.5 40.2 18.3 58.2 14.8 27.4 35.8 50.4 57 73.1l-2.4 2.7zM759.7 835.8c-8.4 47.6-47.3 78.3-96.8 76.1-29.6-1.4-54.9-14.7-71.2-37.7-14.1-19.7-28.1-39.4-42.2-59.2l-75.6-106.5c36.2-46.1 72.1-92 99.3-127.6 54.5 59.9 109.1 119.6 164.5 178.7 19.2 20.6 27.1 47.6 22 76.2z" p-id="25164" data-spm-anchor-id="a313x.7781069.0.i42" class="selected" fill="#1D6EFE"></path></svg>
\ No newline at end of file
diff --git a/ruoyi-ui/src/assets/icons/svg/103.svg b/ruoyi-ui/src/assets/icons/svg/103.svg
new file mode 100644
index 000000000..5df0f0f1f
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/103.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="1615815567023" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26008" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M549.948235 210.823529l72.884706 46.08c14.757647 9.336471 31.322353 14.155294 48.489412 14.155295H963.764706v542.117647H60.235294V210.823529h489.712941m8.734118-60.235294H30.117647c-16.564706 0-30.117647 13.552941-30.117647 30.117647v662.588236c0 16.564706 13.552941 30.117647 30.117647 30.117647h963.764706c16.564706 0 30.117647-13.552941 30.117647-30.117647V240.941176c0-16.564706-13.552941-30.117647-30.117647-30.117647H671.322353c-5.722353 0-11.444706-1.505882-16.263529-4.818823l-80.414118-50.898824a29.033412 29.033412 0 0 0-15.962353-4.517647z" fill="#1D6EFE" p-id="26009" data-spm-anchor-id="a313x.7781069.0.i58" class="selected"></path><path d="M421.647059 331.294118H150.588235c-16.564706 0-30.117647-13.552941-30.117647-30.117647s13.552941-30.117647 30.117647-30.117647h271.058824c16.564706 0 30.117647 13.552941 30.117647 30.117647s-13.552941 30.117647-30.117647 30.117647zM662.588235 421.647059h-30.117647c-16.564706 0-30.117647-13.552941-30.117647-30.117647s13.552941-30.117647 30.117647-30.117647h30.117647c16.564706 0 30.117647 13.552941 30.117647 30.117647s-13.552941 30.117647-30.117647 30.117647zM873.411765 421.647059h-90.352941c-16.564706 0-30.117647-13.552941-30.117648-30.117647s13.552941-30.117647 30.117648-30.117647h90.352941c16.564706 0 30.117647 13.552941 30.117647 30.117647s-13.552941 30.117647-30.117647 30.117647zM210.823529 421.647059H150.588235c-16.564706 0-30.117647-13.552941-30.117647-30.117647s13.552941-30.117647 30.117647-30.117647h60.235294c16.564706 0 30.117647 13.552941 30.117647 30.117647s-13.552941 30.117647-30.117647 30.117647zM388.216471 692.705882H271.058824v-50.29647h80.414117c16.564706 0 30.117647-13.552941 30.117647-30.117647s-13.552941-30.117647-30.117647-30.117647H271.058824v-50.296471h111.134117c16.564706 0 30.117647-13.552941 30.117647-30.117647s-13.552941-30.117647-30.117647-30.117647H240.941176c-16.564706 0-30.117647 13.552941-30.117647 30.117647V722.823529c0 16.564706 13.552941 30.117647 30.117647 30.117647h147.275295c16.564706 0 30.117647-13.552941 30.117647-30.117647s-13.552941-30.117647-30.117647-30.117647zM843.294118 692.705882h-117.157647v-190.644706c0-16.564706-13.552941-30.117647-30.117647-30.117647s-30.117647 13.552941-30.117648 30.117647V722.823529c0 16.564706 13.552941 30.117647 30.117648 30.117647H843.294118c16.564706 0 30.117647-13.552941 30.117647-30.117647s-13.552941-30.117647-30.117647-30.117647zM615.604706 471.943529h-147.275294c-16.564706 0-30.117647 13.552941-30.117647 30.117647s13.552941 30.117647 30.117647 30.117648H512V722.823529c0 16.564706 13.552941 30.117647 30.117647 30.117647s30.117647-13.552941 30.117647-30.117647v-190.644705h43.369412c16.564706 0 30.117647-13.552941 30.117647-30.117648s-13.251765-30.117647-30.117647-30.117647z" fill="#1D6EFE" p-id="26010" data-spm-anchor-id="a313x.7781069.0.i55" class="selected"></path></svg>
\ No newline at end of file
diff --git a/ruoyi-ui/src/assets/icons/svg/104.svg b/ruoyi-ui/src/assets/icons/svg/104.svg
new file mode 100644
index 000000000..00a72f800
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/104.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="1615815401139" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="24238" width="64" height="64" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M0 0h1024v1024H0z" fill="#FFFFFF" p-id="24239"></path><path d="M944 250H80c-27.57 0-50-22.43-50-50V80c0-27.57 22.43-50 50-50h864c27.57 0 50 22.43 50 50v120c0 27.57-22.43 50-50 50z" fill="#D8DDE3" p-id="24240"></path><path d="M80 60c-11.028 0-20 8.972-20 20v120c0 11.028 8.972 20 20 20h864c11.028 0 20-8.972 20-20V80c0-11.028-8.972-20-20-20H80m0-60h864c44.182 0 80 35.818 80 80v120c0 44.182-35.818 80-80 80H80c-44.182 0-80-35.818-80-80V80C0 35.818 35.818 0 80 0z" fill="#1D6EFE" p-id="24241" data-spm-anchor-id="a313x.7781069.0.i19" class="selected"></path><path d="M944 622H80c-27.57 0-50-22.43-50-50v-120c0-27.57 22.43-50 50-50h864c27.57 0 50 22.43 50 50v120c0 27.57-22.43 50-50 50z" fill="#FFFFFF" p-id="24242"></path><path d="M80 432c-11.028 0-20 8.972-20 20v120c0 11.028 8.972 20 20 20h864c11.028 0 20-8.972 20-20v-120c0-11.028-8.972-20-20-20H80m0-60h864c44.182 0 80 35.818 80 80v120c0 44.182-35.818 80-80 80H80c-44.182 0-80-35.818-80-80v-120c0-44.182 35.818-80 80-80z" fill="#1D6EFE" p-id="24243" data-spm-anchor-id="a313x.7781069.0.i20" class="selected"></path><path d="M944 994H80c-27.57 0-50-22.43-50-50v-120c0-27.57 22.43-50 50-50h864c27.57 0 50 22.43 50 50v120c0 27.57-22.43 50-50 50z" fill="#D8DDE3" p-id="24244"></path><path d="M80 804c-11.028 0-20 8.972-20 20v120c0 11.028 8.972 20 20 20h864c11.028 0 20-8.972 20-20v-120c0-11.028-8.972-20-20-20H80m0-60h864c44.182 0 80 35.818 80 80v120c0 44.182-35.818 80-80 80H80c-44.182 0-80-35.818-80-80v-120c0-44.182 35.818-80 80-80z" fill="#1D6EFE" p-id="24245" data-spm-anchor-id="a313x.7781069.0.i21" class="selected"></path><path d="M708 100h156a40 40 0 0 1 0 80h-156a40 40 0 0 1 0-80z" fill="#1D6EFE" p-id="24246" data-spm-anchor-id="a313x.7781069.0.i16" class="selected"></path><path d="M708 472h156a40 40 0 0 1 0 80h-156a40 40 0 0 1 0-80z" fill="#FF402A" p-id="24247"></path><path d="M708 844h156a40 40 0 0 1 0 80h-156a40 40 0 0 1 0-80z" fill="#505873" p-id="24248" data-spm-anchor-id="a313x.7781069.0.i22" class="selected"></path></svg>
\ No newline at end of file
diff --git a/ruoyi-ui/src/assets/icons/svg/105.svg b/ruoyi-ui/src/assets/icons/svg/105.svg
new file mode 100644
index 000000000..a28865368
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/105.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="1615815521521" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25422" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64"><defs><style type="text/css"></style></defs><path d="M851.82464 50.99008H382.44352c-70.20032 0-127.40096 57.20064-127.40096 127.49824v469.888c0 70.2976 57.09824 127.49824 127.40096 127.49824h469.38112c33.97632 0 66.00704-13.30176 90.05056-37.34016 24.04352-24.04864 37.24288-56.07936 37.24288-90.15808V178.49344c0.10752-70.30272-56.99072-127.50336-127.29344-127.50336z m48.30208 597.39136a48.6912 48.6912 0 0 1-48.71168 48.71168H382.03392c-26.80832 0-48.71168-21.89824-48.71168-48.71168V178.49344a48.69632 48.69632 0 0 1 48.71168-48.70656h469.38112c26.80832 0 48.71168 21.89824 48.71168 48.70656v469.888z" fill="#1D6EFE" p-id="25423" data-spm-anchor-id="a313x.7781069.0.i47" class="selected"></path><path d="M477.51168 869.41184a26.29632 26.29632 0 0 1-26.30144 26.30144h-289.9968c-14.42816 0-26.30144-11.77088-26.30144-26.30144v-290.29888a26.2912 26.2912 0 0 1 26.30144-26.30144h46.24896V496.53248h-46.24896c-45.5424 0-82.47808 37.03808-82.47808 82.58048v290.29888c0 45.5424 37.03808 82.58048 82.47808 82.58048h289.9968c45.53728 0 82.47296-37.03808 82.47296-82.58048v-46.24896H477.40416v46.24896h0.10752z m194.42176-281.50272c-10.54208 0-20.36736-5.9392-25.17504-15.04256l-3.2768-6.3488c-4.39808-7.36768-12.38016-11.86816-20.87424-11.86816s-16.47616 4.50048-20.87424 11.86816l-3.2768 6.3488c-4.70528 9.09824-14.62784 15.04256-25.16992 15.04256-1.536 0-3.072-0.1024-4.60288-0.4096l-0.8192-0.1024-0.7168-0.20992c-4.39808-1.42848-8.3968-2.9696-12.18048-4.50048a134.6048 134.6048 0 0 1-11.76576-5.42208l-0.72192-0.4096-0.60928-0.52224c-9.82528-7.06048-14.22336-19.94752-10.74688-31.4112l2.1504-6.8608a24.43264 24.43264 0 0 0-6.34368-23.12192 24.064 24.064 0 0 0-17.18784-7.168c-2.048 0-4.096 0.20992-6.0416 0.72192l-6.75328 2.1504c-2.6624 0.8192-5.4272 1.2288-8.18688 1.2288-9.10848 0-18.01216-4.608-23.22944-11.97056l-0.512-0.61952-0.31232-0.71168a219.136 219.136 0 0 1-5.42208-11.77088c-1.6384-4.10112-3.16928-8.192-4.50048-12.18048l-0.20992-0.72192-0.1024-0.80896c-2.048-11.9808 3.98848-24.25856 14.62784-29.77792l6.3488-3.28192c7.36256-4.39808 11.86816-12.38016 11.86816-20.86912s-4.5056-16.48128-11.86816-20.87936l-6.3488-3.27168c-10.63936-5.5296-16.68096-17.81248-14.62784-29.77792l0.1024-0.8192 0.20992-0.7168c1.42848-4.39808 2.96448-8.39168 4.50048-12.17536 1.6384-4.096 3.4816-8.08448 5.42208-11.86816l0.31232-0.72192 0.4096-0.60928c5.2224-7.36768 14.12096-11.97568 23.22944-11.97568 2.75968 0 5.51936 0.4096 8.18688 1.22368l6.85568 2.1504c1.9456 0.512 3.98848 0.72192 5.93408 0.72192 6.54848 0 12.58496-2.56 17.18784-7.06048 6.0416-6.0416 8.49408-14.94016 6.34368-23.13216l-2.1504-6.85568c-3.57888-11.45856 0.8192-24.35584 10.64448-31.41632l0.6144-0.512 0.7168-0.4096a217.088 217.088 0 0 1 11.76576-5.4272c4.39808-1.83808 8.3968-3.2768 12.27776-4.50048l0.7168-0.2048 0.72192-0.1024c1.536-0.20992 3.072-0.4096 4.60288-0.4096 10.54208 0 20.46464 5.92896 25.16992 15.04256l3.2768 6.34368c4.39808 7.36256 12.38016 11.86816 20.87424 11.86816s16.47616-4.5056 20.87424-11.86816l3.2768-6.34368c4.70528-9.10848 14.63296-15.04256 25.17504-15.04256 1.536 0 3.072 0.1024 4.60288 0.4096l0.81408 0.1024 0.72192 0.2048c4.39808 1.42848 8.39168 2.96448 12.17536 4.50048s7.67488 3.2768 11.77088 5.4272l0.7168 0.4096 0.6144 0.512c9.92256 7.06048 14.32576 20.06016 10.63936 31.41632l-2.1504 6.75328a24.44288 24.44288 0 0 0 6.34368 23.12704 24.07424 24.07424 0 0 0 17.18784 7.16288c2.048 0 4.096-0.20992 6.0416-0.72192l6.85568-2.1504a27.4944 27.4944 0 0 1 8.18688-1.22368c9.10848 0 18.01216 4.60288 23.22944 11.97568l0.512 0.60928 0.31232 0.72192a213.5552 213.5552 0 0 1 5.42208 11.76576c1.6384 4.096 3.1744 8.18688 4.5056 12.17536l0.2048 0.72192 0.1024 0.8192c2.048 11.97056-3.98848 24.24832-14.62784 29.7728l-6.34368 3.2768a24.37632 24.37632 0 0 0-11.86816 20.87936c0 8.48896 4.50048 16.47104 11.86816 20.86912l6.34368 3.28192c10.63936 5.51936 16.68096 17.80224 14.62784 29.88032l-0.1024 0.71168-0.2048 0.72192c-1.4336 4.39808-2.9696 8.39168-4.5056 12.18048-1.536 3.77856-3.2768 7.57248-5.42208 11.76064l-0.4096 0.72192-0.512 0.60928a28.672 28.672 0 0 1-23.33696 11.9808c-2.75968 0-5.52448-0.4096-8.07936-1.2288l-6.8608-2.1504a24.576 24.576 0 0 0-23.12192 6.33856 24.35584 24.35584 0 0 0-6.34368 23.22944l2.1504 6.7584c3.57888 11.45856-0.8192 24.35072-10.74688 31.4112l-0.6144 0.512-0.7168 0.31232c-3.6864 1.83808-7.67488 3.68128-11.77088 5.42208-4.09088 1.7408-8.18688 3.16928-12.27264 4.50048l-0.72192 0.20992-0.81408 0.1024c-1.12128 0.50688-2.65728 0.7168-4.19328 0.7168z m-49.42336-242.62144c-40.7296 0-73.7792 33.05472-73.7792 73.78432 0 40.71936 33.0496 73.76896 73.7792 73.76896 40.72448 0 73.77408-33.0496 73.77408-73.76896 0-40.6272-33.0496-73.78432-73.77408-73.78432z" fill="#1D6EFE" p-id="25424" data-spm-anchor-id="a313x.7781069.0.i44" class="selected"></path></svg>
\ No newline at end of file
diff --git a/ruoyi-ui/src/assets/icons/svg/sx.svg b/ruoyi-ui/src/assets/icons/svg/sx.svg
new file mode 100644
index 000000000..6789d7e68
--- /dev/null
+++ b/ruoyi-ui/src/assets/icons/svg/sx.svg
@@ -0,0 +1 @@
+<svg t="1613659287526" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5920" width="23" height="23"><path d="M513.3 101.9c-190.7 0-348.6 138.8-379.2 320.8H0l160.4 192.5 160.4-192.5H199C228.8 276.4 358.4 166 513.3 166c176.9 0 320.8 143.9 320.8 320.8S690.2 807.7 513.3 807.7c-78 0-148.7-29.1-204.4-75.6l-42.1 50.5c66.8 55.7 152.7 89.3 246.4 89.3 212.6 0 385-172.4 385-385s-172.2-385-384.9-385z" p-id="5921"></path></svg>
diff --git a/ruoyi-ui/src/assets/image/1000009.jpg b/ruoyi-ui/src/assets/image/1000009.jpg
new file mode 100644
index 000000000..6f171d71a
Binary files /dev/null and b/ruoyi-ui/src/assets/image/1000009.jpg differ
diff --git a/ruoyi-ui/src/assets/image/1000168.jpg b/ruoyi-ui/src/assets/image/1000168.jpg
new file mode 100644
index 000000000..1633d9418
Binary files /dev/null and b/ruoyi-ui/src/assets/image/1000168.jpg differ
diff --git a/ruoyi-ui/src/assets/image/1000934.jpg b/ruoyi-ui/src/assets/image/1000934.jpg
new file mode 100644
index 000000000..6bcbc86ed
Binary files /dev/null and b/ruoyi-ui/src/assets/image/1000934.jpg differ
diff --git a/ruoyi-ui/src/assets/image/1001498.jpg b/ruoyi-ui/src/assets/image/1001498.jpg
new file mode 100644
index 000000000..2925ff07c
Binary files /dev/null and b/ruoyi-ui/src/assets/image/1001498.jpg differ
diff --git a/ruoyi-ui/src/assets/image/2000087.jpg b/ruoyi-ui/src/assets/image/2000087.jpg
new file mode 100644
index 000000000..78adb3041
Binary files /dev/null and b/ruoyi-ui/src/assets/image/2000087.jpg differ
diff --git a/ruoyi-ui/src/assets/image/2001159.jpg b/ruoyi-ui/src/assets/image/2001159.jpg
new file mode 100644
index 000000000..5ca925483
Binary files /dev/null and b/ruoyi-ui/src/assets/image/2001159.jpg differ
diff --git a/ruoyi-ui/src/assets/image/2025181.jpg b/ruoyi-ui/src/assets/image/2025181.jpg
new file mode 100644
index 000000000..e9e56c094
Binary files /dev/null and b/ruoyi-ui/src/assets/image/2025181.jpg differ
diff --git a/ruoyi-ui/src/assets/image/2026264.jpg b/ruoyi-ui/src/assets/image/2026264.jpg
new file mode 100644
index 000000000..453e87737
Binary files /dev/null and b/ruoyi-ui/src/assets/image/2026264.jpg differ
diff --git a/ruoyi-ui/src/assets/image/2043428.jpg b/ruoyi-ui/src/assets/image/2043428.jpg
new file mode 100644
index 000000000..bc8261dbc
Binary files /dev/null and b/ruoyi-ui/src/assets/image/2043428.jpg differ
diff --git a/ruoyi-ui/src/assets/image/308183.jpg b/ruoyi-ui/src/assets/image/308183.jpg
new file mode 100644
index 000000000..27f8b2aab
Binary files /dev/null and b/ruoyi-ui/src/assets/image/308183.jpg differ
diff --git a/ruoyi-ui/src/assets/image/308664.jpg b/ruoyi-ui/src/assets/image/308664.jpg
new file mode 100644
index 000000000..9be853418
Binary files /dev/null and b/ruoyi-ui/src/assets/image/308664.jpg differ
diff --git a/ruoyi-ui/src/assets/image/309159.jpg b/ruoyi-ui/src/assets/image/309159.jpg
new file mode 100644
index 000000000..7d8539db9
Binary files /dev/null and b/ruoyi-ui/src/assets/image/309159.jpg differ
diff --git a/ruoyi-ui/src/assets/image/312041.jpg b/ruoyi-ui/src/assets/image/312041.jpg
new file mode 100644
index 000000000..1d9a3dd19
Binary files /dev/null and b/ruoyi-ui/src/assets/image/312041.jpg differ
diff --git a/ruoyi-ui/src/assets/image/315094.jpg b/ruoyi-ui/src/assets/image/315094.jpg
new file mode 100644
index 000000000..1c4a47687
Binary files /dev/null and b/ruoyi-ui/src/assets/image/315094.jpg differ
diff --git a/ruoyi-ui/src/assets/image/315417.jpg b/ruoyi-ui/src/assets/image/315417.jpg
new file mode 100644
index 000000000..64006b4c6
Binary files /dev/null and b/ruoyi-ui/src/assets/image/315417.jpg differ
diff --git a/ruoyi-ui/src/assets/image/315421.jpg b/ruoyi-ui/src/assets/image/315421.jpg
new file mode 100644
index 000000000..73ad1ab9c
Binary files /dev/null and b/ruoyi-ui/src/assets/image/315421.jpg differ
diff --git a/ruoyi-ui/src/assets/image/318721.jpg b/ruoyi-ui/src/assets/image/318721.jpg
new file mode 100644
index 000000000..1ecee3e82
Binary files /dev/null and b/ruoyi-ui/src/assets/image/318721.jpg differ
diff --git a/ruoyi-ui/src/assets/image/319421.jpg b/ruoyi-ui/src/assets/image/319421.jpg
new file mode 100644
index 000000000..b012b8d33
Binary files /dev/null and b/ruoyi-ui/src/assets/image/319421.jpg differ
diff --git a/ruoyi-ui/src/assets/image/319532.jpg b/ruoyi-ui/src/assets/image/319532.jpg
new file mode 100644
index 000000000..82c0fc722
Binary files /dev/null and b/ruoyi-ui/src/assets/image/319532.jpg differ
diff --git a/ruoyi-ui/src/assets/image/323755.jpg b/ruoyi-ui/src/assets/image/323755.jpg
new file mode 100644
index 000000000..c0aa99009
Binary files /dev/null and b/ruoyi-ui/src/assets/image/323755.jpg differ
diff --git a/ruoyi-ui/src/assets/image/324278.jpg b/ruoyi-ui/src/assets/image/324278.jpg
new file mode 100644
index 000000000..ea1e0251c
Binary files /dev/null and b/ruoyi-ui/src/assets/image/324278.jpg differ
diff --git a/ruoyi-ui/src/assets/image/325273.jpg b/ruoyi-ui/src/assets/image/325273.jpg
new file mode 100644
index 000000000..91a30cde2
Binary files /dev/null and b/ruoyi-ui/src/assets/image/325273.jpg differ
diff --git a/ruoyi-ui/src/views/bookmark/vuedraggable/index.vue b/ruoyi-ui/src/views/bookmark/vuedraggable/index.vue
new file mode 100644
index 000000000..60d225147
--- /dev/null
+++ b/ruoyi-ui/src/views/bookmark/vuedraggable/index.vue
@@ -0,0 +1,333 @@
+<template>
+
+    <el-container>
+      <el-aside width="350px" style="margin-bottom: 0px">
+        <h3>自定义布局</h3>
+
+        <el-row>
+          <el-col :span="24">
+            <draggable
+              class="dragArea list-group"
+              :list="list1"
+              :group="{ name: 'people', pull: 'clone', put: false }"
+              @change="log"
+            >
+              <div
+                class="list-group-item"
+                v-for="element in list1"
+                :key="element.id"
+              >
+                {{ element.name }}
+              </div>
+            </draggable>
+          </el-col>
+        </el-row>
+        <br/>
+        <br/>
+        --------------
+
+
+        <el-row>
+          <el-col :span="24">
+            <draggable
+              class="dragArea list-group"
+              :list="list1"
+              group="t1"
+              @change="log"
+            >
+              <div
+                class="list-group-item"
+                v-for="element in list1"
+                :key="element.id"
+              >
+                {{ element.name }}
+              </div>
+            </draggable>
+          </el-col>
+        </el-row>
+
+
+      </el-aside>
+
+      <el-container>
+        <el-header>实时预览</el-header>
+
+<!--        <el-main>-->
+<!--          <el-row>-->
+<!--            <el-col :span="24">-->
+<!--              <div class="grid-content bg-purple-dark">search</div>-->
+<!--            </el-col>-->
+<!--          </el-row>-->
+<!--            <draggable-->
+<!--              class="dragArea list-group "-->
+<!--              :list="list2"-->
+<!--              group="people"-->
+<!--              @change="log"-->
+<!--            >-->
+<!--              <el-row>-->
+
+<!--              <el-col-->
+<!--                :span="24"-->
+<!--                class="borderSolid"-->
+<!--                v-for="(element, idx) in list2"-->
+<!--                :key="element.id"-->
+<!--                :style="'height:'+ element.height +';width:'+element.width "-->
+<!--              >-->
+<!--                {{ element.name }}-->
+<!--                <p>{{ element.data.id }}</p>-->
+<!--                <p>{{ element.data.name }}</p>-->
+<!--                <p>{{ element.data.url }}</p>-->
+<!--                <p>{{ element.data.description }}</p>-->
+<!--                <i class="el-icon-delete" @click="removeAt2(idx)"></i>-->
+<!--              </el-col>-->
+<!--              </el-row>-->
+<!--            </draggable>-->
+
+
+
+<!--        </el-main>-->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+        <el-main>
+          <el-row>
+            <el-col :span="24"
+              ><div class="grid-content bg-purple-dark">search</div></el-col
+            >
+          </el-row>
+
+          <el-row>
+            <el-col :span="2"> - </el-col>
+<!--            <el-col :span="8">-->
+<!--              <div class="grid-content bg-purple borderColor">-->
+<!--                <draggable-->
+<!--                  class="dragArea list-group "-->
+<!--                  :list="list2"-->
+<!--                  group="people"-->
+<!--                  @change="log"-->
+<!--                >-->
+<!--                  <div-->
+<!--                    class="borderSolid"-->
+<!--                    v-for="(element, idx) in list2"-->
+<!--                    :key="element.id"-->
+<!--                    :style="'height:'+ element.height +';width:'+element.width "-->
+<!--                  >-->
+<!--                    {{ element.name }}-->
+<!--                    <p>{{ element.data.id }}</p>-->
+<!--                    <p>{{ element.data.name }}</p>-->
+<!--                    <p>{{ element.data.url }}</p>-->
+<!--                    <p>{{ element.data.description }}</p>-->
+<!--                    <i class="el-icon-delete" @click="removeAt2(idx)"></i>-->
+<!--                  </div>-->
+<!--                </draggable>-->
+<!--              </div>-->
+<!--            </el-col>-->
+
+            <el-col :span="11">
+              <div class="grid-content bg-purple-light borderColor">
+                <draggable
+                  class="dragArea list-group"
+                  :list="list3"
+                  group="people"
+                  @change="log"
+                >
+                  <div
+                    class="borderSolid"
+                    v-for="(element, idx) in list3"
+                    :key="element.id"
+                    :style="'height:'+ element.height "
+                  >
+                    {{ element.name }}
+                    <p>{{ element.data.id }}</p>
+                    <p>{{ element.data.name }}</p>
+                    <p>{{ element.data.url }}</p>
+                    <p>{{ element.data.description }}</p>
+                    <i class="el-icon-delete" @click="removeAt3(idx)"></i>
+                  </div>
+                </draggable>
+              </div>
+            </el-col>
+            <el-col :span="2"> - </el-col>
+
+            <el-col :span="8">
+              <div class="grid-content bg-purple-light borderColor">
+                <draggable
+                  class="dragArea list-group"
+                  :list="list4"
+                  group="people"
+                  @change="log"
+                >
+
+
+                  <el-card class="box-card"  v-for="(element, idx) in list4"
+                    :key="element.id" :style="'height:'+ element.height ">
+                    <div slot="header" class="clearfix">
+                      <span>卡片名称</span>
+
+
+                      <draggable  class="dragArea list-group"
+                                  :list="list8"
+                                  group="people"
+                      >
+                        <a class="box-card"  v-for="(element, idx) in list4"
+                                 :key="element.id" :style="'height:'+ element.height ">
+
+                        </a>
+
+                      </draggable>
+                     <i class="el-icon-delete" style="float: right; padding: 3px 0" @click="removeAt4(idx)"></i>
+
+
+                    </div>
+                    <div v-for="o in 4" :key="o" class="text item">
+                      {{ "列表内容 " + o }}
+                    </div>
+                  </el-card>
+
+                </draggable>
+
+              </div>
+            </el-col>
+            <el-col :span="1"> - </el-col>
+          </el-row>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+
+<script>
+import draggable from "vuedraggable";
+export default {
+  name: "clone",
+  display: "Clone",
+  order: 2,
+  components: {
+    draggable,
+  },
+  data() {
+    return {
+      list1: [
+        {
+          name: "热点新闻",
+          id: 1,
+          height:"800px",
+          width:"400px",
+          data: {
+            id: 1,
+            title: "百度书签",
+            url: "https://www.baidu.com",
+            description: "这是个百度的书签"
+          },
+        },
+        {
+          name: "最近收藏",
+          id: 2,
+          height:"300px",
+          width:"400px",
+          data: {
+            id: 1,
+            title: "百度书签",
+            url: "https://www.baidu.com",
+            description: "这是个百度的书签",
+          },
+        },
+        {
+          name: "常用导航",
+          id: 3,
+          height:"300px",
+          width:"400px",
+          data: {
+            id: 1,
+            title: "百度书签",
+            url: "https://www.baidu.com",
+            description: "这是个百度的书签",
+          },
+        },
+        {
+          name: "热门推荐",
+          id: 4,
+          height:"300px",
+          width:"400px",
+          data: {
+            id: 1,
+            title: "百度书签",
+            url: "https://www.baidu.com",
+            description: "这是个百度的书签",
+          },
+        },
+      ],
+      list2: [],
+      list3: [],
+      list4: [],
+      list8: [],
+      list9: [],
+    };
+  },
+  methods: {
+    log: function (evt) {
+      window.console.log(evt);
+    },
+    removeAt2(idx) {
+      this.list2.splice(idx, 1);
+    },
+    removeAt3(idx) {
+      this.list3.splice(idx, 1);
+    },
+    removeAt4(idx) {
+      this.list4.splice(idx, 1);
+    },
+  },
+};
+</script>
+<style scoped>
+.el-header,
+.el-footer {
+  background-color: #b3c0d1;
+  color: #333;
+  text-align: center;
+  line-height: 60px;
+}
+
+.el-aside {
+  background-color: #d3dce6;
+  color: #333;
+  text-align: center;
+  height: 700px;
+}
+
+.el-main {
+  background-color: #e9eef3;
+  color: #333;
+  text-align: center;
+  height: 500px;
+}
+
+.el-container:nth-child(5) .el-aside,
+.el-container:nth-child(6) .el-aside {
+  line-height: 260px;
+}
+
+.el-container:nth-child(7) .el-aside {
+  line-height: 320px;
+}
+.borderColor {
+  border: 1px solid #404040;
+  height: 600px;
+}
+.borderSolid {
+  border: 1px solid #404040;
+
+}
+</style>