修改自定义置底效果显示逻辑

v1.0.0
于肖磊 2024-10-14 16:34:31 +08:00
parent 606ed22977
commit 8b940f8582
17 changed files with 135 additions and 64 deletions

View File

@ -1,9 +1,9 @@
@font-face {
font-family: "iconfont"; /* Project id 4227145 */
src: url('iconfont.woff2?t=1728611284151') format('woff2'),
url('iconfont.woff?t=1728611284151') format('woff'),
url('iconfont.ttf?t=1728611284151') format('truetype'),
url('iconfont.svg?t=1728611284151#iconfont') format('svg');
src: url('iconfont.woff2?t=1728892263234') format('woff2'),
url('iconfont.woff?t=1728892263234') format('woff'),
url('iconfont.ttf?t=1728892263234') format('truetype'),
url('iconfont.svg?t=1728892263234#iconfont') format('svg');
}
.iconfont {
@ -14,6 +14,14 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-cancel-bottom-placement:before {
content: "\e79f";
}
.icon-bottom-up:before {
content: "\e7a0";
}
.icon-domain:before {
content: "\e7cf";
}
@ -182,11 +190,11 @@
content: "\e738";
}
.icon-arrow-left1:before {
.icon-arrow-left:before {
content: "\e73f";
}
.icon-arrow-right1:before {
.icon-arrow-right:before {
content: "\e737";
}
@ -574,10 +582,6 @@
content: "\e6d4";
}
.icon-arrow-left:before {
content: "\e6d1";
}
.icon-scan:before {
content: "\e6cf";
}
@ -650,10 +654,6 @@
content: "\e6c1";
}
.icon-arrow-right:before {
content: "\e6c2";
}
.icon-zhibo-shixiao:before {
content: "\e6bb";
}
@ -670,7 +670,7 @@
content: "\e6b8";
}
.icon-categroy-more:before {
.icon-category-more:before {
content: "\e6b7";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,20 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "42097664",
"name": "取消置底",
"font_class": "cancel-bottom-placement",
"unicode": "e79f",
"unicode_decimal": 59295
},
{
"icon_id": "42097665",
"name": "置底",
"font_class": "bottom-up",
"unicode": "e7a0",
"unicode_decimal": 59296
},
{
"icon_id": "7561087",
"name": "域名服务",
@ -21,7 +35,7 @@
},
{
"icon_id": "38735708",
"name": "yinyong-shangchuan",
"name": "文件上传",
"font_class": "upload-file",
"unicode": "e72d",
"unicode_decimal": 59181
@ -302,14 +316,14 @@
{
"icon_id": "40047124",
"name": "进销存左箭头",
"font_class": "arrow-left1",
"font_class": "arrow-left",
"unicode": "e73f",
"unicode_decimal": 59199
},
{
"icon_id": "40047129",
"name": "进销存右箭头",
"font_class": "arrow-right1",
"font_class": "arrow-right",
"unicode": "e737",
"unicode_decimal": 59191
},
@ -985,13 +999,6 @@
"unicode": "e6d4",
"unicode_decimal": 59092
},
{
"icon_id": "37356823",
"name": "箭头-向左",
"font_class": "arrow-left",
"unicode": "e6d1",
"unicode_decimal": 59089
},
{
"icon_id": "37354114",
"name": "扫一扫",
@ -1118,13 +1125,6 @@
"unicode": "e6c1",
"unicode_decimal": 59073
},
{
"icon_id": "37288621",
"name": "箭头-向右",
"font_class": "arrow-right",
"unicode": "e6c2",
"unicode_decimal": 59074
},
{
"icon_id": "37272530",
"name": "zhibo-shixiao",
@ -1156,7 +1156,7 @@
{
"icon_id": "37217394",
"name": "分类更多",
"font_class": "categroy-more",
"font_class": "category-more",
"unicode": "e6b7",
"unicode_decimal": 59063
},

View File

@ -14,11 +14,15 @@
/>
<missing-glyph />
<glyph glyph-name="cancel-bottom-placement" unicode="&#59295;" d="M911.872 831.715556A90.396444 90.396444 0 0 1 876.088889 839.111111H147.911111A91.306667 91.306667 0 0 1 56.888889 748.088889v-728.177778A91.363556 91.363556 0 0 1 147.911111-71.111111h216.177778a34.133333 34.133333 0 1 1 0 68.266667H170.666667a45.511111 45.511111 0 0 0-45.511111 45.511111V725.333333a45.511111 45.511111 0 0 0 45.511111 45.511111h682.666666a45.511111 45.511111 0 0 0 45.511111-45.511111v-193.422222a34.133333 34.133333 0 0 1 68.266667 0V748.088889a91.363556 91.363556 0 0 1-55.239111 83.626667zM957.155556-12.913778a34.133333 34.133333 0 0 0-48.241778-48.241778l-152.860445 152.860445-153.031111-152.860445a34.247111 34.247111 0 0 0-48.298666 0 34.247111 34.247111 0 0 0 0 48.241778l152.974222 152.860445-152.803556 153.031111a34.304 34.304 0 0 0 0 48.298666 34.304 34.304 0 0 0 48.241778 0l152.917333-152.974222 152.860445 152.860445a34.133333 34.133333 0 0 0 48.241778-48.184889l-152.860445-152.860445 152.860445-153.031111z" horiz-adv-x="1024" />
<glyph glyph-name="bottom-up" unicode="&#59296;" d="M932.465778 169.813333c19.171556 0 34.645333-15.701333 34.645333-35.100444a34.872889 34.872889 0 0 0-34.645333-35.157333H91.591111A34.872889 34.872889 0 0 0 56.888889 134.712889c0 19.342222 15.473778 35.100444 34.645333 35.100444H932.408889zM116.053333 714.524444l403.512889-430.307555 388.437334 414.208a33.848889 33.848889 0 0 0 44.145777 4.778667l4.266667-3.584c13.767111-13.255111 14.279111-35.328 1.194667-49.152L544.426667 209.806222a34.019556 34.019556 0 0 0-49.777778-0.113778L66.332444 666.567111a35.157333 35.157333 0 0 0 1.137778 49.152 33.962667 33.962667 0 0 0 48.526222-1.137778z" horiz-adv-x="1024" />
<glyph glyph-name="domain" unicode="&#59343;" d="M352.457463 457.129832l-55.631569-193.107892h-62.607512l-28.475392 113.146691c-1.88598 7.545135-2.955188 15.777185-3.206409 24.705858h-1.131103c-0.881095-9.806127-2.139629-17.794238-3.771961-23.952194l-30.549485-113.901568H105.227757l-54.500466 193.107892h60.722745l26.590625-125.974756c1.253679-5.91159 2.197883-13.074432 2.828971-21.497022h1.131103c0.627447 8.796388 1.758549 16.217733 3.393308 22.253113l33.191557 125.218665h56.762671l29.795821-125.974756c0.753664-3.145728 1.631118-10.434788 2.639645-21.875674h1.319215a216.955714 216.955714 0 0 0 3.017084 21.875674l25.082083 125.974756h55.255344zM660.408699 457.129832l-55.631568-193.107892h-62.609939l-28.474179 113.145477c-1.887194 7.547563-2.956402 15.779612-3.206409 24.708286h-1.132317c-0.879881-9.806127-2.138415-17.794238-3.770747-23.952195l-30.550699-113.901568h-61.853847l-54.499252 193.107892h60.723958l26.589412-125.974755c1.254893-5.91159 2.197883-13.074432 2.82897-21.497022h1.132317c0.626233 8.796388 1.759763 16.217733 3.393308 22.253113l33.191557 125.218664h56.762671l29.793394-125.974755c0.756091-3.145728 1.634759-10.434788 2.642072-21.875674h1.320429a216.613471 216.613471 0 0 0 3.018297 21.875674l25.079656 125.974755h55.252916zM968.358722 457.129832L912.728367 264.023154h-62.608725l-28.476606 113.143049c-1.88598 7.547563-2.953975 15.779612-3.206409 24.708286h-1.132316c-0.878668-9.806127-2.138415-17.794238-3.770748-23.952194l-30.550698-113.901568h-61.853848L666.628551 457.129832h60.726386l26.586984-125.974755c1.25732-5.91159 2.200311-13.074432 2.830184-21.497022h1.132317c0.627447 8.796388 1.758549 16.217733 3.392095 22.253113l33.193984 125.218664h56.761458l29.795821-125.974755c0.756091-3.145728 1.634759-10.434788 2.644499-21.875674h1.318001a216.944792 216.944792 0 0 0 3.014656 21.875674l25.079657 125.974755h55.254129zM228.98157 535.599483a6.068148 6.068148 0 0 0-5.745322 8.024519c35.237736 103.580862 132.467674 173.172812 241.944348 173.172812a6.068148 6.068148 0 0 0 0-12.136296c-104.277485 0-196.890776-66.287237-230.454917-164.945617a6.070575 6.070575 0 0 0-5.744109-4.115418zM506.492549-59.571769c-174.451977 0-332.055135 103.42309-401.513586 263.482634-5.336329 12.297709 0.307048 26.593052 12.604757 31.929382 12.295282 5.335116 26.591839-0.305835 31.929382-12.603544 61.75433-142.31021 201.876366-234.263287 356.979447-234.263287 154.515684 0 294.428975 91.470052 356.443022 233.032666 5.378807 12.277077 19.692354 17.875551 31.973073 12.493104 12.278291-5.38002 17.873124-19.694782 12.493103-31.973073C837.650811 43.307615 680.284312-59.571769 506.492549-59.571769zM116.356741 490.166044c-2.660276 0-5.364243 0.440548-8.017238 1.368975-12.653303 4.427321-19.320984 18.273621-14.893662 30.926924 29.684167 84.835138 84.070552 157.603157 157.276691 210.437309 74.797208 53.982246 163.240467 82.515892 255.770017 82.515892 92.169102 0 180.332013-28.33097 254.955671-81.929709 73.018027-52.445791 127.450529-124.750203 157.410191-209.096249 4.486789-12.632671-2.11657-26.510526-14.748028-30.997314-12.632671-4.484361-26.510526 2.115356-30.997314 14.748027-54.968927 154.753555-202.301137 258.728846-366.62052 258.728846-165.139797 0-312.715947-104.663419-367.224908-260.441277C135.767533 496.428373 126.384962 490.166044 116.356741 490.166044z" horiz-adv-x="1024" />
<glyph glyph-name="download-btn" unicode="&#59143;" d="M919.296 0H104.704a40.704 40.704 0 1 1 0-81.472h814.592a40.704 40.704 0 0 1 0 81.472z m-30.656 566.08l-58.624 57.856-300.544-300.544V896H448v-581.568L138.496 623.9359999999999l-57.024-57.856 403.2-403.2 403.968 403.2z" horiz-adv-x="1024" />
<glyph glyph-name="upload-file" unicode="&#59181;" d="M872.90418594 8.773953750000032H144.87813969a67.35627937 67.35627937 0 0 0-67.27813969 67.27813969V686.41116281A67.35627937 67.35627937 0 0 0 144.87813969 753.70046531h315.85116281a67.35627937 67.35627937 0 0 0 67.2893025-67.2893025c0-10.57116281-8.65116281-19.22232562-19.23348844-19.22232562a19.27813969 19.27813969 0 0 0-19.22232562 19.22232562 28.8 28.8 0 0 1-28.83348844 28.84465125H144.8893025a28.8 28.8 0 0 1-28.83348844-28.84465125v-610.35906937a28.8 28.8 0 0 1 28.83348844-28.83348844H872.91534875c10.57116281 0 19.22232562-8.65116281 19.22232562-19.22232562s-8.461395-19.22232562-19.22232562-19.22232563zM872.90418594 8.773953750000032a19.27813969 19.27813969 0 0 0-19.22232563 19.22232563c0 10.57116281 8.65116281 19.22232562 19.22232563 19.22232562a28.8 28.8 0 0 1 28.83348844 28.83348844V471.49395375a28.8 28.8 0 0 1-28.83348844 28.83348844H304.26046531a28.8 28.8 0 0 1-28.83348843-28.83348844V213.29860499999995c0-10.57116281-8.65116281-19.22232562-19.23348844-19.22232563a19.27813969 19.27813969 0 0 0-19.22232563 19.22232563V471.49395375a67.35627937 67.35627937 0 0 0 67.2893025 67.27813969h568.63255781a67.35627937 67.35627937 0 0 0 67.2893025-67.27813969v-395.44186031a67.35627937 67.35627937 0 0 0-67.27813968-67.27813969zM728.53581406 599.52H557.23162813a67.35627937 67.35627937 0 0 0-67.27813969 67.2893025v9.9906975c0 10.58232562 8.65116281 19.22232562 19.22232562 19.22232562s19.22232562-8.64 19.22232563-19.22232562v-9.9906975a28.8 28.8 0 0 1 28.83348844-28.83348844h171.29302312c10.57116281 0 19.22232562-8.65116281 19.22232563-19.23348844 0-10.57116281-8.65116281-19.22232562-19.22232563-19.22232562zM208.32744219 8.773953750000032h-15.18139594a19.27813969 19.27813969 0 0 0-19.22232562 19.22232563c0 10.57116281 8.65116281 19.22232562 19.22232562 19.22232562h15.18139594a28.8 28.8 0 0 1 28.83348844 28.83348844V238.11348843999997c0 10.57116281 8.65116281 19.22232562 19.23348843 19.22232562 10.57116281 0 19.22232562-8.65116281 19.22232469-19.22232562v-162.061395c-0.18976781-37.10511656-30.18418594-67.27813969-67.28930156-67.27813969zM809.28744219 500.13767437a19.27813969 19.27813969 0 0 0-19.23348844 19.22232563v51.12558094a28.8 28.8 0 0 1-28.83348844 28.84465125H674.3293025a19.27813969 19.27813969 0 0 0-19.22232563 19.22232562c0 10.57116281 8.65116281 19.22232562 19.22232563 19.22232563h86.89116281a67.35627937 67.35627937 0 0 0 67.2893025-67.27813969v-51.13674375c0-10.57116281-8.65116281-19.22232562-19.22232562-19.22232563zM597.99813969 148.141395a19.27813969 19.27813969 0 0 0-19.22232563 19.22232562V371.33023218999995c0 10.58232562 8.65116281 19.23348844 19.22232563 19.23348843s19.22232562-8.65116281 19.22232562-19.23348843v-203.96651156c0-10.57116281-8.65116281-19.22232562-19.22232562-19.22232563zM680.27906937 269.82697686999995c-5.00093062 0-9.80093062 1.93116281-13.6520925 5.58139501l-82.26976781 82.26976781a19.14418594 19.14418594 0 0 0 0 27.11441812 19.14418594 19.14418594 0 0 0 27.10325625 0l82.4706975-82.26976687a19.14418594 19.14418594 0 0 0-13.65209344-32.69581407zM515.52744219 269.82697686999995c-5.00093062 0-9.80093062 1.93116281-13.65209344 5.58139501a19.14418594 19.14418594 0 0 0 0 27.10325625l82.4706975 82.47069749a19.14418594 19.14418594 0 0 0 27.11441906 0 19.14418594 19.14418594 0 0 0 0-27.10325625L528.98976781 275.40837188c-3.661395-3.85116281-8.461395-5.581395-13.46232562-5.58139501z" horiz-adv-x="1024" />
<glyph glyph-name="upload-file" unicode="&#59181;" d="M872.904186 8.773954H144.87814a67.356279 67.356279 0 0 0-67.27814 67.278139V686.411163A67.356279 67.356279 0 0 0 144.87814 753.700465h315.851162a67.356279 67.356279 0 0 0 67.289303-67.289302c0-10.571163-8.651163-19.222326-19.233488-19.222326a19.27814 19.27814 0 0 0-19.222326 19.222326 28.8 28.8 0 0 1-28.833488 28.844651H144.889303a28.8 28.8 0 0 1-28.833489-28.844651v-610.35907a28.8 28.8 0 0 1 28.833489-28.833488H872.915349c10.571163 0 19.222326-8.651163 19.222325-19.222326s-8.461395-19.222326-19.222325-19.222325zM872.904186 8.773954a19.27814 19.27814 0 0 0-19.222326 19.222325c0 10.571163 8.651163 19.222326 19.222326 19.222326a28.8 28.8 0 0 1 28.833488 28.833488V471.493954a28.8 28.8 0 0 1-28.833488 28.833488H304.260465a28.8 28.8 0 0 1-28.833488-28.833488V213.298605c0-10.571163-8.651163-19.222326-19.233489-19.222326a19.27814 19.27814 0 0 0-19.222325 19.222326V471.493954a67.356279 67.356279 0 0 0 67.289302 67.278139h568.632558a67.356279 67.356279 0 0 0 67.289303-67.278139v-395.441861a67.356279 67.356279 0 0 0-67.27814-67.278139zM728.535814 599.52H557.231628a67.356279 67.356279 0 0 0-67.27814 67.289303v9.990697c0 10.582326 8.651163 19.222326 19.222326 19.222326s19.222326-8.64 19.222326-19.222326v-9.990697a28.8 28.8 0 0 1 28.833488-28.833489h171.293023c10.571163 0 19.222326-8.651163 19.222326-19.233488 0-10.571163-8.651163-19.222326-19.222326-19.222326zM208.327442 8.773954h-15.181396a19.27814 19.27814 0 0 0-19.222325 19.222325c0 10.571163 8.651163 19.222326 19.222325 19.222326h15.181396a28.8 28.8 0 0 1 28.833489 28.833488V238.113488c0 10.571163 8.651163 19.222326 19.233488 19.222326 10.571163 0 19.222326-8.651163 19.222325-19.222326v-162.061395c-0.189768-37.105117-30.184186-67.27814-67.289302-67.278139zM809.287442 500.137674a19.27814 19.27814 0 0 0-19.233488 19.222326v51.125581a28.8 28.8 0 0 1-28.833489 28.844651H674.329303a19.27814 19.27814 0 0 0-19.222326 19.222326c0 10.571163 8.651163 19.222326 19.222326 19.222325h86.891162a67.356279 67.356279 0 0 0 67.289303-67.278139v-51.136744c0-10.571163-8.651163-19.222326-19.222326-19.222326zM597.99814 148.141395a19.27814 19.27814 0 0 0-19.222326 19.222326V371.330232c0 10.582326 8.651163 19.233488 19.222326 19.233489s19.222326-8.651163 19.222325-19.233489v-203.966511c0-10.571163-8.651163-19.222326-19.222325-19.222326zM680.279069 269.826977c-5.000931 0-9.800931 1.931163-13.652092 5.581395l-82.269768 82.269768a19.144186 19.144186 0 0 0 0 27.114418 19.144186 19.144186 0 0 0 27.103256 0l82.470698-82.269767a19.144186 19.144186 0 0 0-13.652094-32.695814zM515.527442 269.826977c-5.000931 0-9.800931 1.931163-13.652093 5.581395a19.144186 19.144186 0 0 0 0 27.103256l82.470697 82.470698a19.144186 19.144186 0 0 0 27.114419 0 19.144186 19.144186 0 0 0 0-27.103257L528.989768 275.408372c-3.661395-3.851163-8.461395-5.581395-13.462326-5.581395z" horiz-adv-x="1024" />
<glyph glyph-name="panel" unicode="&#59294;" d="M827.562667 827.733333H196.437333C125.7472 827.733333 68.266667 762.504533 68.266667 682.3936v-596.821333C68.266667 5.5296 125.713067-59.733333 196.437333-59.733333h631.125334C898.286933-59.733333 955.733333 5.495467 955.733333 85.6064V682.3936C955.733333 762.4704 898.286933 827.733333 827.562667 827.733333z m54.203733-741.922133c0-39.492267-27.648-71.5776-61.678933-71.5776H203.912533c-34.030933 0-61.678933 32.085333-61.678933 71.5776V682.1888c0 39.492267 27.648 71.5776 61.678933 71.5776h616.174934c34.030933 0 61.678933-32.085333 61.678933-71.5776v-596.3776z" horiz-adv-x="1024" />
@ -98,9 +102,9 @@
<glyph glyph-name="arrow-top1" unicode="&#59192;" d="M512 507.099429l-370.761143-370.761143a39.862857 39.862857 0 1 0-56.393143 56.466285L483.766857 591.7257139999999a39.862857 39.862857 0 0 0 56.466286 0l398.921143-398.921143a39.789714 39.789714 0 0 0 0-56.466285 39.862857 39.862857 0 0 0-56.393143 0L512 507.172571z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-left1" unicode="&#59199;" d="M368.932571 364.03200000000004l370.761143-370.761143a39.862857 39.862857 0 1 0-56.393143-56.32L284.306286 335.798857a39.862857 39.862857 0 0 0 0 56.32l398.994285 398.994286a39.789714 39.789714 0 0 0 56.32 0 39.862857 39.862857 0 0 0 0-56.32l-370.688-370.834286z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-left" unicode="&#59199;" d="M368.932571 364.032l370.761143-370.761143a39.862857 39.862857 0 1 0-56.393143-56.32L284.306286 335.798857a39.862857 39.862857 0 0 0 0 56.32l398.994285 398.994286a39.789714 39.789714 0 0 0 56.32 0 39.862857 39.862857 0 0 0 0-56.32l-370.688-370.834286z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-right1" unicode="&#59191;" d="M655.067429 364.03200000000004l-370.761143-370.761143a39.862857 39.862857 0 1 1 56.393143-56.32l398.994285 398.921143a39.862857 39.862857 0 0 1 0 56.32L340.699429 791.259429a39.789714 39.789714 0 0 1-56.32 0 39.862857 39.862857 0 0 1 0-56.32l370.688-370.834286z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-right" unicode="&#59191;" d="M655.067429 364.032l-370.761143-370.761143a39.862857 39.862857 0 1 1 56.393143-56.32l398.994285 398.921143a39.862857 39.862857 0 0 1 0 56.32L340.699429 791.259429a39.789714 39.789714 0 0 1-56.32 0 39.862857 39.862857 0 0 1 0-56.32l370.688-370.834286z" horiz-adv-x="1024" />
<glyph glyph-name="add" unicode="&#59168;" d="M473.6-38.39999999999998a38.4 38.4 0 1 1 76.8 0v384h384a38.4 38.4 0 1 1 0 76.8h-384v384a38.4 38.4 0 0 1-76.8 0v-384h-384a38.4 38.4 0 0 1 0-76.8h384v-384z" horiz-adv-x="1024" />
@ -294,8 +298,6 @@
<glyph glyph-name="bjdz-guanbi" unicode="&#59092;" d="M512-128A512 512 0 1 0 512 896a512 512 0 0 0 0-1024zM305.92 525.632L447.552 384l-141.504-141.632a45.568 45.568 0 1 1 64.384-64.384L512 319.488l141.632-141.504a45.568 45.568 0 0 1 64.384 64.384L576.512 384l141.504 141.632a45.568 45.568 0 1 1-64.384 64.384L512 448.512 370.368 590.016a45.568 45.568 0 0 1-64.384-64.384z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-left" unicode="&#59089;" d="M732.672 739.6351999999999L361.472 405.6576a29.0816 29.0816 0 0 1 0-43.264l371.2-334.0288A36.352 36.352 0 0 0 684.288-25.600000000000023l-371.2512 333.9776a101.632 101.632 0 0 0 0 151.2448L684.1856 793.6a36.2496 36.2496 0 1 0 48.5376-53.9648z" horiz-adv-x="1024" />
<glyph glyph-name="scan" unicode="&#59087;" d="M801.28571416-66h-128.57142832v64.28571416h128.57142832a96.42857168 96.42857168 0 0 1 96.42857168 96.42857168v128.57142832h64.28571416v-128.57142832a160.71428584 160.71428584 0 0 0-160.71428584-160.71428584z m128.57142832 417.85714248H94.14285752a32.14285752 32.14285752 0 0 0 0 64.28571504h835.71428496a32.14285752 32.14285752 0 0 0 0-64.28571504z m-32.14285664 321.42857168A96.42857168 96.42857168 0 0 1 801.28571416 769.71428584h-128.57142832V834h128.57142832A160.71428584 160.71428584 0 0 0 962 673.28571416v-128.57142832h-64.28571416v128.57142832z m-771.42857168 0v-128.57142832H62v128.57142832A160.71428584 160.71428584 0 0 0 222.71428584 834h128.57142832v-64.28571416h-128.57142832A96.42857168 96.42857168 0 0 1 126.28571416 673.28571416z m0-578.57142832A96.42857168 96.42857168 0 0 1 222.71428584-1.7142858400000023h128.57142832v-64.28571416h-128.57142832A160.71428584 160.71428584 0 0 0 62 94.71428584v128.57142832h64.28571416v-128.57142832z" horiz-adv-x="1024" />
<glyph glyph-name="wodeqianbao-eye" unicode="&#59088;" d="M512 709.818182c257.070545 0 465.454545-140.846545 465.454545-314.554182s-208.384-314.554182-465.454545-314.554182S46.545455 221.55636400000003 46.545455 395.264 254.929455 709.818182 512 709.818182z m0-116.084364a198.656 198.656 0 0 1-198.469818-198.469818 198.656 198.656 0 0 1 198.423273-198.469818 198.656 198.656 0 0 1 198.469818 198.469818A198.656 198.656 0 0 1 512 593.7338179999999z m0-57.669818a140.939636 140.939636 0 0 0 140.8-140.8 140.939636 140.939636 0 0 0-140.846545-140.8 140.986182 140.986182 0 0 0-140.8 140.8A140.986182 140.986182 0 0 0 512 536.0640000000001z" horiz-adv-x="1024" />
@ -332,8 +334,6 @@
<glyph glyph-name="qiandao-yixuan" unicode="&#59073;" d="M512 896c341.333333 0 512-170.666667 512-512s-170.666667-512-512-512S0 42.666667 0 384 170.666667 896 512 896zM273.408 355.669333a30.464 30.464 0 0 1 0-43.093333l136.832-136.832a32 32 0 0 1 45.269333 0l299.477334 299.52a32 32 0 0 1-45.226667 45.226667l-267.733333-267.690667a16 16 0 0 0-22.613334 0l-102.912 102.869333a30.464 30.464 0 0 1-43.093333 0z" horiz-adv-x="1024" />
<glyph glyph-name="arrow-right" unicode="&#59074;" d="M388.266667 9.813332999999943a43.690667 43.690667 0 0 1 27.136 9.472L834.730667 356.69333300000005a43.264 43.264 0 0 1 0 67.413334L417.28 759.466667a43.178667 43.178667 0 0 1-54.101333-67.413334l375.552-301.738666-377.429334-303.616a43.178667 43.178667 0 0 1 27.136-76.885334z" horiz-adv-x="1109" />
<glyph glyph-name="zhibo-shixiao" unicode="&#59067;" d="M512 896a512 512 0 1 0 0-1024A512 512 0 0 0 512 896z m329.301333-268.373333L280.064 46.421333A409.6 409.6 0 0 1 841.386667 627.626667zM512 793.6a409.6 409.6 0 0 1-319.488-665.856l564.48 584.533333A407.808 407.808 0 0 1 512 793.6z" horiz-adv-x="1024" />
<glyph glyph-name="cart-dec" unicode="&#59066;" d="M512 896c282.7776 0 512-229.2224 512-512s-229.2224-512-512-512S0 101.2224 0 384 229.2224 896 512 896z m0-51.2a460.8 460.8 0 1 1 0-921.6 460.8 460.8 0 0 1 0 921.6zM288.3584 416.1536v-63.0784h447.2832V416.1536z" horiz-adv-x="1024" />
@ -342,7 +342,7 @@
<glyph glyph-name="arrow-top" unicode="&#59064;" d="M195.447467 177.76639999999998c0 9.557333 3.208533 19.114667 9.557333 27.170133l337.988267 420.181334a43.349333 43.349333 0 0 0 67.584 0l336.145066-418.474667a43.281067 43.281067 0 0 0-67.515733-54.203733L576.853333 528.8618670000001 272.520533 150.52800000000002a43.281067 43.281067 0 0 0-77.073066 27.170133z" horiz-adv-x="1092" />
<glyph glyph-name="categroy-more" unicode="&#59063;" d="M0 486.4h1024v-102.4H0z m0-512h409.6v-102.4H0z m0 921.6h1024v-102.4H0z m524.3904-729.6a44.6464 44.6464 0 0 1 0-61.8496l213.6064-219.7504a41.6768 41.6768 0 0 1 60.0064 0L1011.5072 104.44799999999998a44.6464 44.6464 0 0 1 0 61.8496 41.5744 41.5744 0 0 1-60.0064 0L768-22.52800000000002 584.4992 166.39999999999998a41.6768 41.6768 0 0 1-60.1088 0z" horiz-adv-x="1024" />
<glyph glyph-name="category-more" unicode="&#59063;" d="M0 486.4h1024v-102.4H0z m0-512h409.6v-102.4H0z m0 921.6h1024v-102.4H0z m524.3904-729.6a44.6464 44.6464 0 0 1 0-61.8496l213.6064-219.7504a41.6768 41.6768 0 0 1 60.0064 0L1011.5072 104.448a44.6464 44.6464 0 0 1 0 61.8496 41.5744 41.5744 0 0 1-60.0064 0L768-22.528 584.4992 166.4a41.6768 41.6768 0 0 1-60.1088 0z" horiz-adv-x="1024" />
<glyph glyph-name="zhibo-time" unicode="&#59059;" d="M512 896a512 512 0 1 0 0-1024A512 512 0 0 0 512 896z m0-93.110857a418.889143 418.889143 0 1 1 0-837.778286A418.889143 418.889143 0 0 1 512 802.889143z m23.405714-185.929143a23.259429 23.259429 0 0 0 23.332572-23.259429v-242.102857l126.464-85.284571c9.289143-6.290286 12.8-18.285714 8.265143-28.598857l-2.048-3.657143-26.038858-38.619429a23.259429 23.259429 0 0 0-28.525714-8.265143l-3.730286 1.974858-154.331428 104.155428a23.625143 23.625143 0 0 0-1.024 0.731429 23.259429 23.259429 0 0 0-12.068572 20.48V593.627429c0 12.873143 10.386286 23.332571 23.259429 23.332571h46.518857v-0.073143z" horiz-adv-x="1024" />

Before

Width:  |  Height:  |  Size: 176 KiB

After

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -39,9 +39,9 @@
<el-form-item label="旋转角度">
<slider v-model="form.icon_rotate" :max="1000"></slider>
</el-form-item>
<el-form-item label="是否置底">
<!-- <el-form-item label="是否置底">
<el-switch v-model="form.bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
</el-form-item> -->
</card-container>
<div class="bg-f5 divider-line" />
<card-container>

View File

@ -26,9 +26,9 @@
<el-form-item label="旋转角度">
<slider v-model="form.img_rotate" :max="1000"></slider>
</el-form-item>
<el-form-item label="是否置底">
<!-- <el-form-item label="是否置底">
<el-switch v-model="form.bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
</el-form-item> -->
</card-container>
<div class="bg-f5 divider-line" />
<card-container class="h">

View File

@ -31,9 +31,9 @@
<el-form-item label="线条颜色">
<color-picker v-model="form.line_color"></color-picker>
</el-form-item>
<el-form-item label="是否置底">
<!-- <el-form-item label="是否置底">
<el-switch v-model="form.bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
</el-form-item> -->
</card-container>
</el-form>
</div>

View File

@ -20,9 +20,9 @@
<el-form-item label="旋转角度">
<slider v-model="form.panel_rotate" :max="1000"></slider>
</el-form-item>
<el-form-item label="是否置底">
<!-- <el-form-item label="是否置底">
<el-switch v-model="form.bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
</el-form-item> -->
<el-form-item label="容器宽度">
<slider v-model="form.com_width" :max="1000"></slider>
</el-form-item>

View File

@ -59,9 +59,9 @@
<el-form-item label="旋转角度">
<slider v-model="form.text_rotate" :max="1000"></slider>
</el-form-item>
<el-form-item label="是否置底">
<!-- <el-form-item label="是否置底">
<el-switch v-model="form.bottom_up" active-value="1" inactive-value="0" />
</el-form-item>
</el-form-item> -->
</card-container>
<div class="bg-f5 divider-line" />
<card-container>

View File

@ -36,7 +36,7 @@ export const text_com_data = {
border_size: 1,
direction: '90deg',
color_list: [{ color: '', color_percentage: undefined }],
bottom_up: '0',
z_index: 0
}
// 图片的默认值
export const img_com_data = {
@ -68,7 +68,7 @@ export const img_com_data = {
radius_bottom_right: 0,
},
border_size: 1,
bottom_up: '0',
z_index: 0
}
// 线条的默认值
export const line_com_data = {
@ -80,7 +80,7 @@ export const line_com_data = {
line_width: 306,
line_size: 1,
line_color: '#000',
bottom_up: '1',
z_index: 0,
}
// icon的默认值
@ -120,7 +120,7 @@ export const icon_com_data = {
border_size: 1,
direction: '90deg',
color_list: [{ color: '', color_percentage: undefined }],
bottom_up: '0',
z_index: 0
}
// 面板的默认值
@ -144,7 +144,7 @@ export const panel_com_data = {
border_size: 1,
direction: '90deg',
color_list: [{ color: '#fff', color_percentage: undefined }],
bottom_up: '0',
z_index: 0
}
// 判断两个矩形是否有交集或者被包裹

View File

@ -341,4 +341,16 @@
.break{
word-wrap: break-word;
word-break:break-all;
}
.plug-in-show-component-line::after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 0.1rem dashed #999;
border-radius: inherit;
pointer-events: none; /* 防止影子部分阻止鼠标事件 */
}

View File

@ -21,7 +21,12 @@
</card-container>
<card-container class="h selected">
<div class="flex-col gap-10 drawer-container">
<div class="flex-row align-c jc-sb">已选组件<span class="clear-selection" @click="cancel"></span></div>
<div class="flex-row align-c jc-sb">已选组件
<div class="flex-row align-c gap-10">
<span class="clear-selection" @click="show_computer_line">{{ !is_show_component_line ? '' : '' }}线</span>
<span class="clear-selection" @click="cancel"></span>
</div>
</div>
<div ref="left_scrollTop" class="drawer-drag-area">
<VueDraggable v-model="diy_data" :animation="500" target=".sort-target" :scroll="true" @sort="on_sort">
<TransitionGroup type="transition" tag="ul" name="fade" class="sort-target flex-col h">
@ -56,8 +61,18 @@
<div class="model-content">
<div v-if="typeof select_index === 'number' && !isNaN(select_index)" class="acticons">
<div class="plug-in-right" chosenClass="close">
<el-icon class="iconfont icon-del" @click.stop="del(select_index)" />
<el-icon class="iconfont icon-copy" @click.stop="copy(select_index)" />
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="删除组件" placement="top">
<el-icon class="iconfont icon-del" @click.stop="del(select_index)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="复制组件" placement="top">
<el-icon class="iconfont icon-copy" @click.stop="copy(select_index)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="组件置底" placement="top">
<el-icon class="iconfont icon-bottom-up" @click.stop="bottom_up(select_index)" />
</el-tooltip>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="取消置底" placement="top">
<el-icon class="iconfont icon-cancel-bottom-placement" @click.stop="cancel_bottom_up(select_index)" />
</el-tooltip>
</div>
</div>
<!-- 拖拽区 -->
@ -65,9 +80,9 @@
<div class="model-wall">
<div ref="imgBoxRef" class="drag-area re dropzone" @dragover.prevent @dragenter.prevent @drop="drop">
<div class="w h" @mousedown.prevent="start_drag" @mousemove.prevent="move_drag" @mouseup.prevent="end_drag">
<DraggableContainer v-if="draggable_container" :reference-line-visible="true" :disabled="false" reference-line-color="#ddd" @selectstart.prevent @contextmenu.prevent @dragstart.prevent>
<DraggableContainer v-if="draggable_container" style="z-index:0" :reference-line-visible="true" :disabled="false" reference-line-color="#ddd" @selectstart.prevent @contextmenu.prevent @dragstart.prevent>
<!-- @mouseover="on_choose(index)" -->
<Vue3DraggableResizable v-for="(item, index) in diy_data" :key="item.id" v-model:w="item.com_data.com_width" v-model:h="item.com_data.com_height" :min-w="0" :min-h="0" :class="{ 'plug-in-show-tabs': item.show_tabs == '1', 'vdr-handle-z-index': item.com_data.bottom_up == '1', 'z-index': item.com_data.bottom_up == '1' ? 0 : 1}" :init-w="item.com_data.com_width" :init-h="item.com_data.com_height" :x="item.location.x" :y="item.location.y" :parent="true" :draggable="is_draggable" @mousedown.stop="on_choose(index, item.show_tabs)" @click.stop="on_choose(index, item.show_tabs)" @drag-end="dragEndHandle($event, index)" @resizing="resizingHandle($event, item.key, index)" @resize-end="resizingHandle($event, item.key, index)">
<Vue3DraggableResizable v-for="(item, index) in diy_data" :key="item.id" v-model:w="item.com_data.com_width" v-model:h="item.com_data.com_height" :min-w="0" :min-h="0" :class="{'plug-in-show-component-line': is_show_component_line, 'plug-in-show-tabs': item.show_tabs == '1', 'vdr-handle-z-index': item.com_data.bottom_up == '1' }" :style="{ 'z-index': item.com_data.z_index }" :init-w="item.com_data.com_width" :init-h="item.com_data.com_height" :x="item.location.x" :y="item.location.y" :parent="true" :draggable="is_draggable" @mousedown.stop="on_choose(index, item.show_tabs)" @click.stop="on_choose(index, item.show_tabs)" @drag-end="dragEndHandle($event, index)" @resizing="resizingHandle($event, item.key, index)" @resize-end="resizingHandle($event, item.key, index)">
<div :class="['main-content', { 'plug-in-border': item.show_tabs == '1' }]">
<template v-if="item.key == 'text'">
<model-text :key="item.id" :value="item.com_data" :source-list="props.sourceList"></model-text>
@ -167,6 +182,14 @@ const url_computer = (name: string) => {
return new_url;
};
//#endregion
//#region 线
const is_show_component_line = ref(false);
const show_computer_line = () => {
is_show_component_line.value = !is_show_component_line.value;
// set_show_tabs(0);
cancel();
};
//#endregion
//#region
const select_index = ref<null | number>(null);
//
@ -273,12 +296,32 @@ const del = (index: null | number) => {
});
}
};
const bottom_up = (index: number) => {
console.log('bottom_up', index);
if (typeof index === 'number' && !isNaN(index)) {
if (!isEmpty(diy_data.value[index])) {
const new_z_index = z_index.value - 1;
diy_data.value[index].com_data.z_index = new_z_index;
z_index.value = new_z_index;
}
}
};
const cancel_bottom_up = (index: number) => {
if (typeof index === 'number' && !isNaN(index)) {
if (!isEmpty(diy_data.value[index])) {
diy_data.value[index].com_data.z_index = 0;
}
}
};
// indexdiy_data
const get_diy_index_data = (index: number) => {
return (<arrayIndex>diy_data.value)[index.toString()];
};
//
const set_show_tabs = (index: number) => {
is_show_component_line.value = false;
diy_data.value.forEach((item, for_index) => {
// false,true
item.show_tabs = '0';
@ -330,7 +373,7 @@ const center_height = defineModel('height', { type: Number, default: 0 });
const drag_area_height = computed(() => center_height.value + 'px');
const draggable_container = ref(true);
let data = reactive<diy_content[]>([]);
const z_index = ref(0);
watch(() => center_height.value, () => {
data = diy_data.value;
// DOM
@ -352,6 +395,10 @@ watch(() => center_height.value, () => {
com_height: item.com_data.staging_height,
},
}));
if (diy_data.value.length > 0) {
const list = diy_data.value.sort((a, b) => a.com_data.z_index - b.com_data.z_index);
z_index.value = list[list.length - 1].com_data.z_index || 0;
}
//
emits('rightUpdate', {});
draggable_container.value = true;

View File

@ -2,7 +2,7 @@
<div ref="container" class="custom-other" :style="style_container">
<div class="w h" :style="style_img_container">
<div class="w h re">
<div v-for="item in form.custom_list" :key="item.id" class="main-content" :style="{'left': percentage_count(item.location.x * scale, div_width) , 'top': percentage_count(item.location.y * scale, form.height), 'width': percentage_count(item.com_data.com_width * scale, div_width), 'height': percentage_count(item.com_data.com_height * scale, form.height)}">
<div v-for="item in form.custom_list" :key="item.id" class="main-content" :style="{'left': percentage_count(item.location.x * scale, div_width) , 'top': percentage_count(item.location.y * scale, form.height), 'width': percentage_count(item.com_data.com_width * scale, div_width), 'height': percentage_count(item.com_data.com_height * scale, form.height), 'z-index': item.com_data.z_index}">
<template v-if="item.key == 'text'">
<model-text :key="item.com_data" :value="item.com_data" :scale="scale" :source-list="form.data_source_content" :is-percentage="true"></model-text>
</template>

View File

@ -159,6 +159,18 @@ const accomplish = () => {
if (!draglist.value) {
return;
} else {
const list = draglist.value.diy_data.sort((a, b) => a.com_data.z_index - b.com_data.z_index);
let z_index = 0;
if (list.length > 0) {
list.forEach((item) => {
if (item.com_data.z_index < 0) {
const new_z_index = z_index - 1;
item.com_data.z_index = new_z_index;
z_index = new_z_index;
}
});
}
console.log(draglist.value.diy_data);
form.custom_list = draglist.value.diy_data;
}
form.height = center_height.value;