Merge branch 'develop' of http://xny.yj-3d.com:3000/zh/sdk4.0 into develop

2025-08-22 18:32:13 +08:00
parent fb2681fdbe b5e21fec3c
commit a7a743a394
59 changed files with 3735 additions and 488 deletions
--- a/static/3rdparty/ewPlugins.min.js
+++ b/static/3rdparty/ewPlugins.min.js
@ -746,6 +746,7 @@
        o.colorHsbaToRgba)(e.hsba) : e.pickerInput.value = (0,
        o.colorRgbaToHex)((0,
        o.colorHsbaToRgba)(e.hsba))
+        e.config.pickerInputChange && e.config.pickerInputChange()
    }
    function f(e) {
        if (this.pickerFlag = !1,
@ -795,6 +796,8 @@
                n.isFunction)(e.sure) ? e.sure : null,
                clear: (0,
                n.isFunction)(e.clear) ? e.clear : null,
+                pickerInputChange: (0,
+                    n.isFunction)(e.pickerInputChange) ? e.pickerInputChange : null,
                startMainCallback: (0,
                  n.isFunction)(e.startMainCallback) ? e.startMainCallback : null,
                clickDefineColor: (0,
@ -807,8 +810,10 @@
            else
                this.init(o, this.config)
        }
+        this.changeColor = g
        this.close = () => {
          this.pickerFlag = !this.pickerFlag,
+          this.picker.style.opacity = 0
          this.render(this.box.parentNode, this.config),
          d(this),
          g(this, this.panelWidth, this.panelHeight)
@ -890,6 +895,7 @@
            var u = i - e.hsba.a * i;
            c(e.alphaBarThumb, "top", u + "px")
        }
+        e.config.pickerInputChange && e.config.pickerInputChange()
    }
    function b(e, t) {
        var r = e.hueBar.offsetHeight
@ -965,6 +971,7 @@
    }
    ,
    f.prototype.startMain = function(e, t) {
+        // console.log(e,t)
        var r = this;
        this.box = l(e, "ew-color-picker-box"),
        this.box.setAttribute("color-box-id", this.uid),
@ -1002,8 +1009,21 @@
            c += s.offsetParent.offsetTop,
            f += s.offsetParent.offsetLeft,
            s = s.offsetParent;
-        this.pancelLeft = f,
-        this.pancelTop = c + e.offsetHeight,
+        this.pancelLeft = f;
+        let defineColorContainer = this.picker.getElementsByClassName('ew-pre-define-color-container')[0]
+        let customColorHeight = 0
+        if(defineColorContainer) {
+            let colorList = localStorage.getItem('custom-color') || '{}'
+            colorList = JSON.parse(colorList)
+            customColorHeight = (Math.floor((Object.keys(colorList).length+2) / 11)+1) * 30
+        }
+        this.picker.style.display = 'block'
+        this.pancelTop = e.getBoundingClientRect().y + (e.offsetHeight + customColorHeight) + 2
+        if((this.picker.offsetHeight + customColorHeight) + this.pancelTop > window.innerHeight) {
+            this.pancelTop = e.getBoundingClientRect().y - (this.picker.offsetHeight + customColorHeight)
+            this.picker.style.top = this.pancelTop + 2 + 'px'
+        }
+        this.picker.style.display = 'none'
        this.preDefineItem = l(e, "ew-pre-define-color", !0),
        this.preDefineItem.length && (0,
        n.ewObjToArray)(this.preDefineItem).map(function(e) {
@ -1054,7 +1074,7 @@
        }, !1),
        this.pickerClear.addEventListener("click", function() {
            !function(e, t) {
-                t.config.defaultColor = "rgba(255,255,255,1)",
+                t.config.defaultColor = "",
                t.pickerFlag = !t.pickerFlag,
                t.render(e, t.config),
                d(t),
@ -1070,6 +1090,9 @@
                o.colorHsbaToRgba)(e.hsba) : (0,
                o.colorRgbaToHex)((0,
                o.colorHsbaToRgba)(e.hsba));
+                e.config.defaultColor = e.pickerInput.value
+                e.config.pickerInputChange && e.config.pickerInputChange()
+                e.render(e.box.parentNode, e.config),
                e.config.sure(t, e)
            }(r)
        }),
@ -1097,6 +1120,7 @@
            }(r, e)
        }, !1),
        this.bindEvent(this.pickerCursor, function(e, t, r, n) {
+            // console.log(e)
          r=r-7
          n=n-7
            u(e, Math.max(0, Math.min(r - e.pancelLeft, i)), Math.max(0, Math.min(n - e.pancelTop, a)), i, a)
@ -1119,7 +1143,8 @@
                a = i,
                o.moveX = n.eventType[0].indexOf("touch") > -1 ? a.changedTouches[0].clientX : a.clientX,
                o.moveY = n.eventType[0].indexOf("touch") > -1 ? a.changedTouches[0].clientY : a.clientY,
-                r ? t(o, o.moveX, o.moveY) : t(o, e, o.moveX, o.moveY)
+                r ? t(o, o.moveX, o.moveY) : t(o, e, o.moveX, o.moveY);
+                // console.log('222222', i, t,e,  o.moveX, o.moveY)
            };
            document.addEventListener(n.eventType[1], a, {
                capture: !1,
--- a/static/custom/css/index.css
+++ b/static/custom/css/index.css
@ -68,7 +68,6 @@
  z-index: 999999;
  background: linear-gradient(0deg, var(--color-sdk-bg-gradual)), rgba(0, 0, 0, 0.6);
  border: 1.5px solid;
-  backdrop-filter: blur(2px);
  border-image: linear-gradient(to bottom, var(--color-sdk-gradual)) 1;
  text-align: left;
  font-family: 'sy-boldface';
@ -1033,16 +1032,31 @@
  background: linear-gradient(0deg, var(--color-sdk-bg-gradual)), rgba(0, 0, 0, 0.6);
  border-image: linear-gradient(to bottom, var(--color-sdk-gradual)) 1;
  padding: 5px;
+  position: fixed !important;
 }

-.YJ-custom-base-dialog .ew-color-picker>.ew-color-picker-content {
+.YJ-custom-base-dialog>.content .ew-color-picker input {
+  font-size: 14px;
+  line-height: 28px;
+  height: 28px;
+  padding: 0 8px;
+  font-weight: 400;
+}
+
+.YJ-custom-base-dialog>.content .ew-color-picker .input-number-unit input[type=number] {
+  padding: 0 20px 0 8px;
+  width: 66px;
+}
+
+.YJ-custom-base-dialog.ew-color-picker>.ew-color-picker-content {
  margin-bottom: 10px;
 }
-.YJ-custom-base-dialog .ew-color-picker>.ew-color-picker-content>.ew-color-panel  {
+
+.YJ-custom-base-dialog .ew-color-picker>.ew-color-picker-content>.ew-color-panel {
  width: 302px;
 }

-.YJ-custom-base-dialog .ew-color-picker> .ew-color-input {
+.YJ-custom-base-dialog .ew-color-picker>.ew-color-input {
  margin-top: 1px;
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.5);
@ -1058,13 +1072,16 @@
 .YJ-custom-base-dialog .ew-color-picker .icon-pen-box {
  display: inline-block;
  /* cursor: pointer; */
-  cursor: no-drop;
  width: 24px;
  height: 24px;
  text-align: center;
  line-height: 24px;
 }

+.YJ-custom-base-dialog>.content>div .ew-color-picker .row>.col {
+  margin: 0 !important;
+}
+
 .YJ-custom-base-dialog .ew-color-picker .icon-pen-box .icon-pen {
  margin: 0;
 }
@ -1080,9 +1097,9 @@
 }

 .YJ-custom-base-dialog .ew-color-picker .color-alpha>input {
-  font-weight: 400;
-  font-family: Arial;
-  font-size: 14px;
+  font-weight: 400 !important;
+  font-family: Arial !important;
+  font-size: 14px !important;
 }

 .YJ-custom-base-dialog .ew-color-picker>.ew-pre-define-color-container {
@ -1095,6 +1112,7 @@
  margin: 0 0 8px 8px;
  border: 1px solid #9b979b;
 }
+
 .YJ-custom-base-dialog .ew-color-picker>.ew-pre-define-color-container>.ew-pre-define-color:nth-child(11n+1) {
  width: 22px;
  height: 22px;
@ -1124,6 +1142,7 @@
  text-align: center;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==");
 }
+
 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color:nth-child(11n+1) {
  margin: 0 0 8px 0;
 }
@ -1132,14 +1151,16 @@
 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color.subtract {
  border-color: rgba(var(--color-sdk-base-rgb), 0.2);
  background: unset;
+  line-height: 22px;
 }
+
 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color.add:hover,
 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color.subtract:hover {
  border-color: rgba(var(--color-sdk-base-rgb), 0.4);
 }

 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container svg,
-.YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container> svg {
+.YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>svg {
  margin: 0;
 }

@ -1156,10 +1177,12 @@
  border-radius: 3px;
  cursor: pointer;
 }
+
 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color>.yj-pre-define-color-item.subtract-btn {
  position: absolute;
  top: 0;
  left: 0;
+  line-height: 20px;
 }

 .YJ-custom-base-dialog .ew-color-picker>.yj-pre-collect-color-container>.yj-pre-collect-color:hover {
@ -1168,11 +1191,15 @@

 .YJ-custom-base-dialog .ew-color-picker .ew-color-dropbtngroup {
  display: flex;
+  position: unset;
 }

 .YJ-custom-base-dialog .ew-color-picker .ew-color-dropbtngroup button {
-  padding: 5px 10px 4px 10px;
+  padding: 0 8px;
+  height: 28px;
+  line-height: 28px;
 }
+
 .YJ-custom-base-dialog .ew-color-picker .ew-color-dropbtngroup button.ew-color-clear {
  margin-right: 8px;
 }
@ -1180,6 +1207,7 @@
 .YJ-custom-base-dialog .ew-color-picker-box {
  border-width: 4px;
  border-color: #ffffff;
+  display: block;
 }

 .YJ-custom-base-dialog .ew-color-picker-box>.ew-color-picker-no,
@ -1209,12 +1237,12 @@
  transform: rotate(-45deg);
 }

-.YJ-custom-base-dialog .ew-color-picker .ew-color-dropbtns{
+.YJ-custom-base-dialog .ew-color-picker .ew-color-dropbtns {
  display: flex;
  align-items: center;
 }

-.YJ-custom-base-dialog .ew-color-picker svg{
+.YJ-custom-base-dialog .ew-color-picker svg {
  margin: 0;
 }

@ -1401,6 +1429,24 @@
  margin-bottom: 10px;
  display: flex;
  position: relative;
+  overflow-y: auto;
+}
+
+.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar {
+  width: 4px;
+  height: 4px;
+}
+
+.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  background-color: rgba(var(--color-sdk-base-rgb));
+}
+
+.DIV-cy-tabs .DIV-cy-tab-top::-webkit-scrollbar-track {
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  border-radius: 5px;
+  background-color: rgba(var(--color-sdk-base-rgb), 0.1);
 }

 .DIV-cy-tabs .DIV-cy-tab-top::after {
@ -1445,7 +1491,14 @@
  border-bottom: 2px solid #dddddd00;
  position: relative;
  z-index: 2;
+  white-space: nowrap;
+  user-select: none;
  cursor: pointer;
+  -webkit-pointer-events: auto;
+  -moz-pointer-events: auto;
+  -ms-pointer-events: auto;
+  -o-pointer-events: auto;
+  pointer-events: auto;
 }

 .DIV-cy-tabs .DIV-cy-tab-pane-title-p span {
@ -1935,6 +1988,7 @@
 .YJ-custom-base-dialog.water-surface>.content>div .row .label {
  flex: 0 0 60px;
 }
+
 /* 流光飞线 */
 .YJ-custom-base-dialog.flow-line-surface>.content {
  width: 586px;
@ -2104,6 +2158,10 @@
  width: 200px;
 }

+.YJ-custom-base-dialog.particle-effects>.content .ew-color-picker .row>.col {
+  width: auto;
+}
+
 .YJ-custom-base-dialog.particle-effects>.content [type="range"] {
  margin-top: 10px;
 }
@ -2749,6 +2807,7 @@
 .YJ-custom-base-dialog.polyline>.content {
  width: 580px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div #dashTextureDom {
  display: none;
 }
@ -2800,6 +2859,7 @@
 .YJ-custom-base-dialog.polyline>.content>div .spatial-info-table .table-body {
  max-height: 185px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit-box textarea {
  border-radius: unset !important;
 }
@ -2928,34 +2988,37 @@
 }

 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit-box textarea {
-  border-radius: unset!important;
+  border-radius: unset !important;
 }

 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit .datalist {
-   background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
+  background-color: rgba(var(--color-sdk-base-rgb), 0.1) !important;
  border-radius: 4px 0px 0px 4px !important;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(1) .datalist {
-   background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
-   border-radius: 4px 0px, 0px, 4px!important;
+  background-color: rgba(var(--color-sdk-base-rgb), 0.1) !important;
+  border-radius: 4px 0px, 0px, 4px !important;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(2) .datalist {
-   background-color:rgba(var(--color-sdk-base-rgb), 0.1)!important;
-  border-radius: 0px 4px 4px 0px!important;
+  background-color: rgba(var(--color-sdk-base-rgb), 0.1) !important;
+  border-radius: 0px 4px 4px 0px !important;
 }

 .YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(1) input {
-    border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
-}
-.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(2) input {
-  border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
+  border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
 }

-.YJ-custom-base-dialog.polyline>.content input.input-text{
-    background-color: rgba(0, 0, 0, 0.5)!important;
-    border-radius: unset!important;
-    border-top: 1px solid rgba(var(--color-sdk-base-rgb), 0.5)!important;
-    border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
+.YJ-custom-base-dialog.polyline>.content>div .input-select-unit:nth-of-type(2) input {
+  border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
+}
+
+.YJ-custom-base-dialog.polyline>.content input.input-text {
+  background-color: rgba(0, 0, 0, 0.5) !important;
+  border-radius: unset !important;
+  border-top: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
+  border-bottom: 1px solid rgba(var(--color-sdk-base-rgb), 0.5) !important;
 }

 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist input {
@ -2979,65 +3042,78 @@
  height: 13px;
  margin-right: 7px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.line {
  border: 1px solid rgba(var(--color-sdk-base-rgb), 1);
  height: 0px;
  margin-top: 4px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.dash-line {
  border: 1px dashed rgba(var(--color-sdk-base-rgb), 1);
  height: 0px;
  margin-top: 4px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.light-line {
  border: 1px solid rgba(var(--color-sdk-base-rgb), 1);
  height: 0px;
  margin-top: 4px;
  box-shadow: 0 0 3px #fff
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.tail-line {
  background: url(../../img/arrow/tail.png) 100% 100% no-repeat;
  background-size: 100% 100%;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.mult-tail-line {
  background: url(../../img/arrow/tail.png) 100% 100% no-repeat;
  background-size: 100% 100%;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.flow-dash-line1 {
  border: 1px dashed rgba(var(--color-sdk-base-rgb), 1);
  height: 0px;
  margin-top: 4px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.flow-dash-line2 {
  border: 1px dashed rgba(var(--color-sdk-base-rgb), 1);
  height: 0px;
  margin-top: 4px;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line1 {
  background: url(../../img/arrow/1.png);
  background-size: cover;
  background-position: center;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line2 {
  background: url(../../img/arrow/2.png);
  background-size: cover;
  background-position: center;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line3 {
  background: url(../../img/arrow/3.png);
  background-size: cover;
  background-position: center;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line4 {
-  background: url(../../img/arrow/4.png) ;
+  background: url(../../img/arrow/4.png);
  background-size: cover;
  background-position: center;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line5 {
  background: url(../../img/arrow/5.png);
  background-size: cover;
  background-position: center;
 }
+
 .YJ-custom-base-dialog.polyline>.content>div .input-select-line-type-box .cy_datalist i.pic-line6 {
  background: url(../../img/arrow/6.png) 100% 100% no-repeat;
  background-size: 100% 100%;
@ -3083,7 +3159,7 @@

 /* 贴地图片 */
 .YJ-custom-base-dialog.ground-image>.content {
-  width: 500px;
+  width: 560px;
 }

 /* 模型 */
@ -3505,3 +3581,184 @@
 .YJ-custom-base-dialog.contour>.content .label {
  flex: unset;
 }
+
+/* 锚点设置 */
+.YJ-custom-base-dialog.anchor-point {
+  user-select: none;
+}
+
+.YJ-custom-base-dialog.anchor-point>.content {
+  padding: 14px 40px;
+}
+
+.YJ-custom-base-dialog.anchor-point>.content>div {
+  border: 1px solid #757575;
+  position: relative;
+}
+
+.YJ-custom-base-dialog.anchor-point>.content>div>.point {
+  width: 10px;
+  height: 10px;
+  position: absolute;
+  background: #FFDF53;
+  border-radius: 50%;
+  border: 1px solid #ff7300;
+  cursor: pointer;
+}
+
+.billboard-attribute-box {
+  position: absolute;
+  z-index: 1;
+  background: linear-gradient(0deg, var(--color-sdk-bg-gradual)), rgba(0, 0, 0, 0.6);
+  border: 1.5px solid;
+  border-image: linear-gradient(to bottom, var(--color-sdk-gradual)) 1;
+  color: #fff;
+  min-width: 200px;
+  min-height: 120px;
+  box-sizing: border-box;
+  /* -webkit-pointer-events: none;
+  -moz-pointer-events: none;
+  -ms-pointer-events: none;
+  -o-pointer-events: none;
+  pointer-events: none; */
+}
+
+.billboard-attribute-box .DIV-cy-tabs {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-top .DIV-cy-tab-pane-title {
+  padding: 0 2px;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-top .DIV-cy-tab-pane-title:first-child {
+  padding-left: 0;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-top .DIV-cy-tab-pane-title:last-child {
+  padding-right: 0;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-top .DIV-cy-tab-pane-title span {
+  margin: 0 5px;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content {
+  padding: 0 5px 5px 5px;
+  box-sizing: border-box;
+  flex: 1;
+  overflow: auto;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  background-color: rgba(var(--color-sdk-base-rgb));
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content::-webkit-scrollbar-track {
+  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  border-radius: 5px;
+  background-color: rgba(var(--color-sdk-base-rgb), 0.1);
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content-pane {
+  width: 100%;
+  height: 100%;
+}
+
+.billboard-attribute-box .DIV-cy-tabs .DIV-cy-tab-content-pane iframe {
+  border: none;
+}
+
+.billboard-attribute-box .billboard-attribute-box-line {
+  position: absolute;
+  width: 0px;
+  /* border-left: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); */
+  border-left: 1px solid rgba(var(--color-sdk-base-rgb), 1);
+  /* transform: rotate(45deg); */
+  transform-origin: 0px 0px;
+  -webkit-pointer-events: none;
+  -moz-pointer-events: none;
+  -ms-pointer-events: none;
+  -o-pointer-events: none;
+  pointer-events: none;
+}
+
+.billboard-attribute-box .drag-nook {
+  position: absolute;
+  width: 12px;
+  height: 12px;
+  display: block;
+  user-select: none;
+  -webkit-pointer-events: auto;
+  -moz-pointer-events: auto;
+  -ms-pointer-events: auto;
+  -o-pointer-events: auto;
+  pointer-events: auto;
+  z-index: 3;
+  clip-path: polygon(0% 100%, 100% 100%, 50% 50%);
+  background-image: linear-gradient(to top, #ffffff 1px, #00000000 1px);
+  background-size: 100% 3px;
+  /* background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAJRJREFUWEftltsJgFAMQ5NNdBJ1Eh3NTdRJdJPIBQXF50/p/WgHSNNDCSGch877EQbyIyCpBtAa/cZEsj9qXwhImgEURgZA8rTzzkAiYGVgITm+ErC6/Ek3vycMAkHAnYCkAUDKAosZSTaeSZiCqIwgCgJBIG8CWyXzKySSZBGBu+afStYBqIxMfJdSo8WPslHJgsAKWjkmIRBy/c8AAAAASUVORK5CYII='); */
+}
+
+.billboard-attribute-box .drag-nook.left-top {
+  top: -6px;
+  left: -6px;
+  cursor: se-resize;
+  transform: rotate(-45deg);
+  display: none;
+}
+
+.billboard-attribute-box .drag-nook.right-top {
+  top: -6px;
+  right: -6px;
+  cursor: ne-resize;
+  transform: rotate(45deg);
+  display: none;
+}
+
+.billboard-attribute-box .table {
+  background-color: #ffffff00;
+  color: #ffffff;
+  overflow: hidden;
+  border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
+}
+
+.billboard-attribute-box .table .table-head .tr {
+  border-top: none;
+  border-left: none;
+  border-right: none;
+}
+
+.billboard-attribute-box .table .tr {
+  display: flex;
+  border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
+  border-right: none;
+}
+.billboard-attribute-box .table .tr .th, .billboard-attribute-box .table .tr .td {
+  border-right: 1px solid rgba(var(--color-sdk-base-rgb), 0.5);
+  display: flex;
+  justify-content: center;
+}
+.billboard-attribute-box .table .tr .th:last-child, .billboard-attribute-box .table .tr .td:last-child {
+  border-right: none;
+}
+
+
+.billboard-attribute-box .table .table-body .tr {
+  border-bottom: none;
+  border-left: none;
+}
+
+.billboard-attribute-box .table .table-body .tr:first-child {
+  border-top: none;
+}
--- a/static/custom/fonts/PangMenZhengDaoBiaoTiTi-1.ttf
+++ b/static/custom/fonts/PangMenZhengDaoBiaoTiTi-1.ttf
--- a/static/custom/img/icom-confirm.svg
+++ b/static/custom/img/icom-confirm.svg
@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12" height="9.19921875" viewBox="0 0 12 9.19921875" fill="none">
+<path d="M4.66806 9.2C4.47815 9.2 4.29548 9.12926 4.15776 9.00078L0.22761 5.35124C-0.0666872 5.0784 -0.0768368 4.62509 0.204411 4.33925C0.485649 4.0534 0.953909 4.04474 1.2482 4.31759L4.60427 7.43442L10.6916 0.260945C10.9511 -0.0436629 11.4165 -0.0884161 11.731 0.162779C12.0457 0.413972 12.0905 0.864388 11.8325 1.17044L5.23924 8.94014C5.10877 9.09461 4.91741 9.18845 4.713 9.2L4.66806 9.2Z"   fill="#FFFFFF" >
+</path>
+</svg>