Merge branch 'dev' of https://git.yfgame.vip/r/hangtag into dev

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productcareitem/ProductCareItemController.java

@@ -79,6 +79,16 @@ public class ProductCareItemController {
         return success(BeanUtils.toBean(pageResult, ProductCareItemRespVO.class));
     }
 
+    @GetMapping("/list")
+    @Operation(summary = "获取列表")
+    @PreAuthorize("@ss.hasPermission('oms:product-care-item:query')")
+    public CommonResult<PageResult<ProductCareItemRespVO>> queryList(@Valid ProductCareItemPageReqVO pageReqVO) {
+        // 不分页
+        pageReqVO.setPageSize(-1);
+        PageResult<ProductCareItemDO> pageResult = productCareItemService.queryList(pageReqVO);
+        return success(BeanUtils.toBean(pageResult, ProductCareItemRespVO.class));
+    }
+
     @GetMapping("/export-excel")
     @Operation(summary = "导出产品保养项  Excel")
     @PreAuthorize("@ss.hasPermission('oms:product-care-item:export')")

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productcareitem/vo/ProductCareItemPageReqVO.java

@@ -18,15 +18,21 @@ public class ProductCareItemPageReqVO extends PageParam {
     @Schema(description = "说明")
     private String value;
 
+    @Schema(description = "类型 字典oms_product_care_item_type", example = "2")
+    private String type;
+
+    @Schema(description = "语言对照")
+    private String langMapping;
+
     @Schema(description = "icon图标", example = "https://www.iocoder.cn")
     private String iconUrl;
 
-    @Schema(description = "品牌")
-    private String brandIds;
-
-    @Schema(description = "只作用于组合")
+    @Schema(description = "进行多语言组合")
     private Boolean isCombo;
 
+    @Schema(description = "品牌专属")
+    private String brandIds;
+
     @Schema(description = "品牌通用")
     private Boolean isAll;
 

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productcareitem/vo/ProductCareItemRespVO.java

@@ -6,15 +6,13 @@ import java.util.*;
 import org.springframework.format.annotation.DateTimeFormat;
 import java.time.LocalDateTime;
 import com.alibaba.excel.annotation.*;
-import cn.hangtag.framework.excel.core.annotations.DictFormat;
-import cn.hangtag.framework.excel.core.convert.DictConvert;
 
 @Schema(description = "管理后台 - 产品保养项  Response VO")
 @Data
 @ExcelIgnoreUnannotated
 public class ProductCareItemRespVO {
 
-    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "3104")
+    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "27850")
     @ExcelProperty("id")
     private Long id;
 
@@ -22,25 +20,32 @@ public class ProductCareItemRespVO {
     @ExcelProperty("说明")
     private String value;
 
+    @Schema(description = "类型 字典oms_product_care_item_type", example = "2")
+    @ExcelProperty("类型 字典oms_product_care_item_type")
+    private String type;
+
+    @Schema(description = "语言对照")
+    @ExcelProperty("语言对照")
+    private String langMapping;
+
     @Schema(description = "icon图标", example = "https://www.iocoder.cn")
     @ExcelProperty("icon图标")
     private String iconUrl;
 
-    @Schema(description = "品牌")
-    @ExcelProperty("品牌")
-    private String brandIds;
-
-    @Schema(description = "只作用于组合")
-    @ExcelProperty("只作用于组合")
+    @Schema(description = "进行多语言组合")
+    @ExcelProperty("进行多语言组合")
     private Boolean isCombo;
 
+    @Schema(description = "品牌专属")
+    @ExcelProperty("品牌专属")
+    private String brandIds;
+
     @Schema(description = "品牌通用")
     @ExcelProperty("品牌通用")
     private Boolean isAll;
 
     @Schema(description = "语言标识 字典-language_locale")
-    @ExcelProperty(value = "语言标识 字典-language_locale", converter = DictConvert.class)
-    @DictFormat("language_locale") // TODO 代码优化：建议设置到对应的 DictTypeConstants 枚举类中
+    @ExcelProperty("语言标识 字典-language_locale")
     private String locale;
 
     @Schema(description = "启用状态")

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productcareitem/vo/ProductCareItemSaveReqVO.java

@@ -9,22 +9,28 @@ import javax.validation.constraints.*;
 @Data
 public class ProductCareItemSaveReqVO {
 
-    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "3104")
+    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "27850")
     private Long id;
 
     @Schema(description = "说明", requiredMode = Schema.RequiredMode.REQUIRED)
     @NotEmpty(message = "说明不能为空")
     private String value;
 
+    @Schema(description = "类型 字典oms_product_care_item_type", example = "2")
+    private String type;
+
+    @Schema(description = "语言对照")
+    private String langMapping;
+
     @Schema(description = "icon图标", example = "https://www.iocoder.cn")
     private String iconUrl;
 
-    @Schema(description = "品牌")
-    private String brandIds;
-
-    @Schema(description = "只作用于组合")
+    @Schema(description = "进行多语言组合")
     private Boolean isCombo;
 
+    @Schema(description = "品牌专属")
+    private String brandIds;
+
     @Schema(description = "品牌通用")
     private Boolean isAll;
 

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productinfo/vo/ProductInfoPageReqVO.java

@@ -18,25 +18,28 @@ public class ProductInfoPageReqVO extends PageParam {
     @Schema(description = "产品编码")
     private String code;
 
-    @Schema(description = "产品名称", example = "张三")
+    @Schema(description = "产品名称", example = "芋艿")
     private String name;
 
     @Schema(description = "封面")
     private String cover;
 
-    @Schema(description = "品牌", example = "13561")
+    @Schema(description = "品牌", example = "12523")
     private Long brandId;
 
-    @Schema(description = "产品类型id", example = "17099")
+    @Schema(description = "产品类型id", example = "26002")
     private Long productTypeId;
 
-    @Schema(description = "设计稿id", example = "22184")
+    @Schema(description = "设计稿id", example = "29789")
     private String draftDesignDataId;
 
+    @Schema(description = "设计稿列表 json数据带名称")
+    private String draftDesignList;
+
     @Schema(description = "启用状态")
     private Boolean enabled;
 
-    @Schema(description = "备注", example = "你猜")
+    @Schema(description = "备注", example = "你说的对")
     private String remark;
 
     @Schema(description = "详情介绍")

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productinfo/vo/ProductInfoRespVO.java

@@ -12,7 +12,7 @@ import com.alibaba.excel.annotation.*;
 @ExcelIgnoreUnannotated
 public class ProductInfoRespVO {
 
-    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "14473")
+    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "3187")
     @ExcelProperty("id")
     private Long id;
 
@@ -20,7 +20,7 @@ public class ProductInfoRespVO {
     @ExcelProperty("产品编码")
     private String code;
 
-    @Schema(description = "产品名称", requiredMode = Schema.RequiredMode.REQUIRED, example = "张三")
+    @Schema(description = "产品名称", requiredMode = Schema.RequiredMode.REQUIRED, example = "芋艿")
     @ExcelProperty("产品名称")
     private String name;
 
@@ -28,26 +28,27 @@ public class ProductInfoRespVO {
     @ExcelProperty("封面")
     private String cover;
 
-    @Schema(description = "品牌", example = "13561")
+    @Schema(description = "品牌", example = "12523")
     @ExcelProperty("品牌")
     private Long brandId;
 
-    @ExcelProperty("品牌")
-    private String brandName;
-
-    @Schema(description = "产品类型id", example = "17099")
+    @Schema(description = "产品类型id", example = "26002")
     @ExcelProperty("产品类型id")
     private Long productTypeId;
 
-    @Schema(description = "设计稿id", example = "22184")
+    @Schema(description = "设计稿id", example = "29789")
     @ExcelProperty("设计稿id")
     private String draftDesignDataId;
 
+    @Schema(description = "设计稿列表 json数据带名称")
+    @ExcelProperty("设计稿列表 json数据带名称")
+    private String draftDesignList;
+
     @Schema(description = "启用状态")
     @ExcelProperty("启用状态")
     private Boolean enabled;
 
-    @Schema(description = "备注", example = "你猜")
+    @Schema(description = "备注", example = "你说的对")
     @ExcelProperty("备注")
     private String remark;
 

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/controller/admin/productinfo/vo/ProductInfoSaveReqVO.java

@@ -9,32 +9,35 @@ import javax.validation.constraints.*;
 @Data
 public class ProductInfoSaveReqVO {
 
-    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "14473")
+    @Schema(description = "id", requiredMode = Schema.RequiredMode.REQUIRED, example = "3187")
     private Long id;
 
     @Schema(description = "产品编码")
     private String code;
 
-    @Schema(description = "产品名称", requiredMode = Schema.RequiredMode.REQUIRED, example = "张三")
+    @Schema(description = "产品名称", requiredMode = Schema.RequiredMode.REQUIRED, example = "芋艿")
     @NotEmpty(message = "产品名称不能为空")
     private String name;
 
     @Schema(description = "封面")
     private String cover;
 
-    @Schema(description = "品牌", example = "13561")
+    @Schema(description = "品牌", example = "12523")
     private Long brandId;
 
-    @Schema(description = "产品类型id", example = "17099")
+    @Schema(description = "产品类型id", example = "26002")
     private Long productTypeId;
 
-    @Schema(description = "设计稿id", example = "22184")
+    @Schema(description = "设计稿id", example = "29789")
     private String draftDesignDataId;
 
+    @Schema(description = "设计稿列表 json数据带名称")
+    private String draftDesignList;
+
     @Schema(description = "启用状态")
     private Boolean enabled;
 
-    @Schema(description = "备注", example = "你猜")
+    @Schema(description = "备注", example = "你说的对")
     private String remark;
 
     @Schema(description = "详情介绍")

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/dal/dataobject/productcareitem/ProductCareItemDO.java

@@ -31,26 +31,32 @@ public class ProductCareItemDO extends BaseDO {
      * 说明
      */
     private String value;
+    /**
+     * 类型 字典oms_product_care_item_type
+     */
+    private String type;
+    /**
+     * 语言对照
+     */
+    private String langMapping;
     /**
      * icon图标
      */
     private String iconUrl;
     /**
-     * 品牌
-     */
-    private String brandIds;
-    /**
-     * 只作用于组合
+     * 进行多语言组合
      */
     private Boolean isCombo;
+    /**
+     * 品牌专属
+     */
+    private String brandIds;
     /**
      * 品牌通用
      */
     private Boolean isAll;
     /**
      * 语言标识 字典-language_locale
-     *
-     * 枚举 {@link TODO language_locale 对应的类}
      */
     private String locale;
     /**

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/dal/dataobject/productinfo/ProductInfoDO.java

@@ -43,12 +43,6 @@ public class ProductInfoDO extends BaseDO {
      * 品牌
      */
     private Long brandId;
-
-    /**
-     * 品牌名称
-     */
-    @TableField(exist = false)
-    private String brandName;
     /**
      * 产品类型id
      */
@@ -57,6 +51,10 @@ public class ProductInfoDO extends BaseDO {
      * 设计稿id
      */
     private String draftDesignDataId;
+    /**
+     * 设计稿列表 json数据带名称
+     */
+    private String draftDesignList;
     /**
      * 启用状态
      */
@@ -70,4 +68,10 @@ public class ProductInfoDO extends BaseDO {
      */
     private String details;
 
+    /**
+     * 品牌名称
+     */
+    @TableField(exist = false)
+    private String brandName;
+
 }

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/dal/mysql/productcareitem/ProductCareItemMapper.java

@@ -3,6 +3,7 @@ package cn.hangtag.module.oms.dal.mysql.productcareitem;
 import java.util.*;
 
 import cn.hangtag.framework.common.pojo.PageResult;
+import cn.hangtag.framework.common.util.FuncUtil;
 import cn.hangtag.framework.mybatis.core.query.LambdaQueryWrapperX;
 import cn.hangtag.framework.mybatis.core.mapper.BaseMapperX;
 import cn.hangtag.module.oms.dal.dataobject.productcareitem.ProductCareItemDO;
@@ -20,9 +21,11 @@ public interface ProductCareItemMapper extends BaseMapperX<ProductCareItemDO> {
     default PageResult<ProductCareItemDO> selectPage(ProductCareItemPageReqVO reqVO) {
         return selectPage(reqVO, new LambdaQueryWrapperX<ProductCareItemDO>()
                 .eqIfPresent(ProductCareItemDO::getValue, reqVO.getValue())
+                .eqIfPresent(ProductCareItemDO::getType, reqVO.getType())
+                .eqIfPresent(ProductCareItemDO::getLangMapping, reqVO.getLangMapping())
                 .eqIfPresent(ProductCareItemDO::getIconUrl, reqVO.getIconUrl())
-                .eqIfPresent(ProductCareItemDO::getBrandIds, reqVO.getBrandIds())
                 .eqIfPresent(ProductCareItemDO::getIsCombo, reqVO.getIsCombo())
+                .eqIfPresent(ProductCareItemDO::getBrandIds, reqVO.getBrandIds())
                 .eqIfPresent(ProductCareItemDO::getIsAll, reqVO.getIsAll())
                 .eqIfPresent(ProductCareItemDO::getLocale, reqVO.getLocale())
                 .eqIfPresent(ProductCareItemDO::getEnabled, reqVO.getEnabled())
@@ -31,4 +34,40 @@ public interface ProductCareItemMapper extends BaseMapperX<ProductCareItemDO> {
                 .orderByDesc(ProductCareItemDO::getId));
     }
 
+    default PageResult<ProductCareItemDO> queryPage(ProductCareItemPageReqVO reqVO) {
+        LambdaQueryWrapperX<ProductCareItemDO> queryWrapperX = new LambdaQueryWrapperX<ProductCareItemDO>()
+                .eqIfPresent(ProductCareItemDO::getValue, reqVO.getValue())
+                .eqIfPresent(ProductCareItemDO::getLangMapping, reqVO.getLangMapping())
+                .eqIfPresent(ProductCareItemDO::getIconUrl, reqVO.getIconUrl())
+                .eqIfPresent(ProductCareItemDO::getIsCombo, reqVO.getIsCombo())
+                .eqIfPresent(ProductCareItemDO::getLocale, reqVO.getLocale())
+                .eqIfPresent(ProductCareItemDO::getEnabled, reqVO.getEnabled())
+                .eqIfPresent(ProductCareItemDO::getRemark, reqVO.getRemark())
+                .betweenIfPresent(ProductCareItemDO::getCreateTime, reqVO.getCreateTime())
+                .orderByDesc(ProductCareItemDO::getId);
+        String brandIds = reqVO.getBrandIds();
+        if(FuncUtil.isNotEmpty(reqVO.getType())){
+            String[] split = reqVO.getType().split(",");
+            List<Long> types = new ArrayList<>();
+            for (String s : split) {
+                types.add(new Long(s));
+            }
+            queryWrapperX.in(ProductCareItemDO::getType, types);
+        }
+        if (brandIds != null && !brandIds.isEmpty()) {
+            queryWrapperX.and(w ->{
+                String[] split = brandIds.split(",");
+                List<Long> brandIdList = new ArrayList<>();
+                for (String s : split) {
+                    brandIdList.add(new Long(s));
+                }
+                w.eq(ProductCareItemDO::getIsAll, reqVO.getIsAll());
+                w.or().in(ProductCareItemDO::getBrandIds, brandIdList);
+            });
+        }else {
+            queryWrapperX.eqIfPresent(ProductCareItemDO::getIsAll, true);
+        }
+        return selectPage(reqVO, queryWrapperX);
+    }
+
 }

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/dal/mysql/productinfo/ProductInfoMapper.java

@@ -25,6 +25,7 @@ public interface ProductInfoMapper extends BaseMapperX<ProductInfoDO> {
                 .eqIfPresent(ProductInfoDO::getBrandId, reqVO.getBrandId())
                 .eqIfPresent(ProductInfoDO::getProductTypeId, reqVO.getProductTypeId())
                 .eqIfPresent(ProductInfoDO::getDraftDesignDataId, reqVO.getDraftDesignDataId())
+                .eqIfPresent(ProductInfoDO::getDraftDesignList, reqVO.getDraftDesignList())
                 .eqIfPresent(ProductInfoDO::getEnabled, reqVO.getEnabled())
                 .eqIfPresent(ProductInfoDO::getRemark, reqVO.getRemark())
                 .eqIfPresent(ProductInfoDO::getDetails, reqVO.getDetails())

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/service/productcareitem/ProductCareItemService.java

@@ -51,5 +51,6 @@ public interface ProductCareItemService {
      * @return 产品保养项 分页
      */
     PageResult<ProductCareItemDO> getProductCareItemPage(ProductCareItemPageReqVO pageReqVO);
+    PageResult<ProductCareItemDO> queryList(ProductCareItemPageReqVO pageReqVO);
 
 }

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/service/productcareitem/ProductCareItemServiceImpl.java

@@ -71,4 +71,8 @@ public class ProductCareItemServiceImpl implements ProductCareItemService {
         return productCareItemMapper.selectPage(pageReqVO);
     }
 
+    @Override
+    public PageResult<ProductCareItemDO> queryList(ProductCareItemPageReqVO pageReqVO) {
+        return productCareItemMapper.queryPage(pageReqVO);
+    }
 }

hangtag-module-oms/hangtag-module-oms-biz/src/main/java/cn/hangtag/module/oms/service/productinfo/ProductInfoService.java

@@ -52,5 +52,10 @@ public interface ProductInfoService {
      */
     PageResult<ProductInfoDO> getProductInfoPage(ProductInfoPageReqVO pageReqVO);
 
-    String getNewCode();
+    /**
+     * 获取编码
+     *
+     * @return {@link String }
+     */
+    public String getNewCode();
 }

hangtag-module-oms/hangtag-module-oms-biz/src/test/java/cn/hangtag/module/oms/service/productcareitem/ProductCareItemServiceImplTest.java

@@ -111,9 +111,11 @@ public class ProductCareItemServiceImplTest extends BaseDbUnitTest {
        // mock 数据
        ProductCareItemDO dbProductCareItem = randomPojo(ProductCareItemDO.class, o -> { // 等会查询到
            o.setValue(null);
+           o.setType(null);
+           o.setLangMapping(null);
            o.setIconUrl(null);
-           o.setBrandIds(null);
            o.setIsCombo(null);
+           o.setBrandIds(null);
            o.setIsAll(null);
            o.setLocale(null);
            o.setEnabled(null);
@@ -123,12 +125,16 @@ public class ProductCareItemServiceImplTest extends BaseDbUnitTest {
        productCareItemMapper.insert(dbProductCareItem);
        // 测试 value 不匹配
        productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setValue(null)));
+       // 测试 type 不匹配
+       productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setType(null)));
+       // 测试 langMapping 不匹配
+       productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setLangMapping(null)));
        // 测试 iconUrl 不匹配
        productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setIconUrl(null)));
-       // 测试 brandIds 不匹配
-       productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setBrandIds(null)));
        // 测试 isCombo 不匹配
        productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setIsCombo(null)));
+       // 测试 brandIds 不匹配
+       productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setBrandIds(null)));
        // 测试 isAll 不匹配
        productCareItemMapper.insert(cloneIgnoreId(dbProductCareItem, o -> o.setIsAll(null)));
        // 测试 locale 不匹配
@@ -142,9 +148,11 @@ public class ProductCareItemServiceImplTest extends BaseDbUnitTest {
        // 准备参数
        ProductCareItemPageReqVO reqVO = new ProductCareItemPageReqVO();
        reqVO.setValue(null);
+       reqVO.setType(null);
+       reqVO.setLangMapping(null);
        reqVO.setIconUrl(null);
-       reqVO.setBrandIds(null);
        reqVO.setIsCombo(null);
+       reqVO.setBrandIds(null);
        reqVO.setIsAll(null);
        reqVO.setLocale(null);
        reqVO.setEnabled(null);

hangtag-module-oms/hangtag-module-oms-biz/src/test/java/cn/hangtag/module/oms/service/productinfo/ProductInfoServiceImplTest.java

@@ -31,7 +31,7 @@ import static org.mockito.Mockito.*;
 /**
  * {@link ProductInfoServiceImpl} 的单元测试类
  *
- * @author YuanFeng
+ * @author 芋道源码
  */
 @Import(ProductInfoServiceImpl.class)
 public class ProductInfoServiceImplTest extends BaseDbUnitTest {
@@ -112,23 +112,31 @@ public class ProductInfoServiceImplTest extends BaseDbUnitTest {
        ProductInfoDO dbProductInfo = randomPojo(ProductInfoDO.class, o -> { // 等会查询到
            o.setCode(null);
            o.setName(null);
+           o.setCover(null);
            o.setBrandId(null);
            o.setProductTypeId(null);
+           o.setDraftDesignDataId(null);
+           o.setDraftDesignList(null);
            o.setEnabled(null);
            o.setRemark(null);
            o.setDetails(null);
            o.setCreateTime(null);
-           o.setCover(null);
        });
        productInfoMapper.insert(dbProductInfo);
        // 测试 code 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setCode(null)));
        // 测试 name 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setName(null)));
+       // 测试 cover 不匹配
+       productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setCover(null)));
        // 测试 brandId 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setBrandId(null)));
        // 测试 productTypeId 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setProductTypeId(null)));
+       // 测试 draftDesignDataId 不匹配
+       productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setDraftDesignDataId(null)));
+       // 测试 draftDesignList 不匹配
+       productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setDraftDesignList(null)));
        // 测试 enabled 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setEnabled(null)));
        // 测试 remark 不匹配
@@ -137,19 +145,19 @@ public class ProductInfoServiceImplTest extends BaseDbUnitTest {
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setDetails(null)));
        // 测试 createTime 不匹配
        productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setCreateTime(null)));
-       // 测试 cover 不匹配
-       productInfoMapper.insert(cloneIgnoreId(dbProductInfo, o -> o.setCover(null)));
        // 准备参数
        ProductInfoPageReqVO reqVO = new ProductInfoPageReqVO();
        reqVO.setCode(null);
        reqVO.setName(null);
+       reqVO.setCover(null);
        reqVO.setBrandId(null);
        reqVO.setProductTypeId(null);
+       reqVO.setDraftDesignDataId(null);
+       reqVO.setDraftDesignList(null);
        reqVO.setEnabled(null);
        reqVO.setRemark(null);
        reqVO.setDetails(null);
        reqVO.setCreateTime(buildBetweenTime(2023, 2, 1, 2023, 2, 28));
-       reqVO.setCover(null);
 
        // 调用
        PageResult<ProductInfoDO> pageResult = productInfoService.getProductInfoPage(reqVO);

hangtag-ui/hangtag-ui-admin/.env.dev

@@ -4,12 +4,12 @@ NODE_ENV=production
 VITE_DEV=true
 
 # 请求路径
-VITE_BASE_URL='http://localhost:8080'
+VITE_BASE_URL='http://127.0.0.1:48080'
 
 # 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持S3服务
 VITE_UPLOAD_TYPE=server
 # 上传路径
-VITE_UPLOAD_URL='http://localhost:8080/admin-api/infra/file/upload'
+VITE_UPLOAD_URL='http://api-dashboard.yudao.iocoder.cn/admin-api/infra/file/upload'
 
 # 接口地址
 VITE_API_URL=/admin-api

hangtag-ui/hangtag-ui-admin/src/api/oms/productcareitem/index.ts

@@ -1,47 +1,50 @@
-import request from '@/config/axios'
-
-// 产品保养项  VO
-export interface ProductCareItemVO {
-  id: number // id
-  value: string // 说明
-  iconUrl: string // icon图标
-  brandIds: string // 品牌
-  isCombo: boolean // 只作用于组合
-  isAll: boolean // 品牌通用
-  locale: string // 语言标识 字典-language_locale
-  enabled: boolean // 启用状态
-  remark: string // 备注
-}
-
-// 产品保养项  API
-export const ProductCareItemApi = {
-  // 查询产品保养项 分页
-  getProductCareItemPage: async (params: any) => {
-    return await request.get({ url: `/oms/product-care-item/page`, params })
-  },
-
-  // 查询产品保养项 详情
-  getProductCareItem: async (id: number) => {
-    return await request.get({ url: `/oms/product-care-item/get?id=` + id })
-  },
-
-  // 新增产品保养项 
-  createProductCareItem: async (data: ProductCareItemVO) => {
-    return await request.post({ url: `/oms/product-care-item/create`, data })
-  },
-
-  // 修改产品保养项 
-  updateProductCareItem: async (data: ProductCareItemVO) => {
-    return await request.put({ url: `/oms/product-care-item/update`, data })
-  },
-
-  // 删除产品保养项 
-  deleteProductCareItem: async (id: number) => {
-    return await request.delete({ url: `/oms/product-care-item/delete?id=` + id })
-  },
-
-  // 导出产品保养项  Excel
-  exportProductCareItem: async (params) => {
-    return await request.download({ url: `/oms/product-care-item/export-excel`, params })
-  },
-}
+import request from '@/config/axios'
+
+// 产品保养项  VO
+export interface ProductCareItemVO {
+  id: number // id
+  value: string // 说明
+  iconUrl: string // icon图标
+  brandIds: string // 品牌
+  isCombo: boolean // 只作用于组合
+  isAll: boolean // 品牌通用
+  locale: string // 语言标识 字典-language_locale
+  enabled: boolean // 启用状态
+  remark: string // 备注
+}
+
+// 产品保养项  API
+export const ProductCareItemApi = {
+  // 查询产品保养项 分页
+  getProductCareItemPage: async (params: any) => {
+    return await request.get({ url: `/oms/product-care-item/page`, params })
+  },
+  queryList: async (params: any) => {
+    return await request.get({ url: `/oms/product-care-item/list`, params })
+  },
+
+  // 查询产品保养项 详情
+  getProductCareItem: async (id: number) => {
+    return await request.get({ url: `/oms/product-care-item/get?id=` + id })
+  },
+
+  // 新增产品保养项 
+  createProductCareItem: async (data: ProductCareItemVO) => {
+    return await request.post({ url: `/oms/product-care-item/create`, data })
+  },
+
+  // 修改产品保养项 
+  updateProductCareItem: async (data: ProductCareItemVO) => {
+    return await request.put({ url: `/oms/product-care-item/update`, data })
+  },
+
+  // 删除产品保养项 
+  deleteProductCareItem: async (id: number) => {
+    return await request.delete({ url: `/oms/product-care-item/delete?id=` + id })
+  },
+
+  // 导出产品保养项  Excel
+  exportProductCareItem: async (params) => {
+    return await request.download({ url: `/oms/product-care-item/export-excel`, params })
+  },
+}

hangtag-ui/hangtag-ui-admin/src/api/oms/productinfo/index.ts

@@ -1,47 +1,49 @@
-import request from '@/config/axios'
-
-// 产品资料  VO
-export interface ProductInfoVO {
-  id: number // id
-  code: string // 产品编码
-  name: string // 产品名称
-  brandId: number // 品牌
-  productTypeId: number // 产品类型id
-  enabled: boolean // 启用状态
-  remark: string // 备注
-  details: string // 详情介绍
-  cover: string // 封面
-}
-
-// 产品资料  API
-export const ProductInfoApi = {
-  // 查询产品资料 分页
-  getProductInfoPage: async (params: any) => {
-    return await request.get({ url: `/oms/product-info/page`, params })
-  },
-
-  // 查询产品资料 详情
-  getProductInfo: async (id: number) => {
-    return await request.get({ url: `/oms/product-info/get?id=` + id })
-  },
-
-  // 新增产品资料 
-  createProductInfo: async (data: ProductInfoVO) => {
-    return await request.post({ url: `/oms/product-info/create`, data })
-  },
-
-  // 修改产品资料 
-  updateProductInfo: async (data: ProductInfoVO) => {
-    return await request.put({ url: `/oms/product-info/update`, data })
-  },
-
-  // 删除产品资料 
-  deleteProductInfo: async (id: number) => {
-    return await request.delete({ url: `/oms/product-info/delete?id=` + id })
-  },
-
-  // 导出产品资料  Excel
-  exportProductInfo: async (params) => {
-    return await request.download({ url: `/oms/product-info/export-excel`, params })
-  },
-}
+import request from '@/config/axios'
+
+// 产品资料  VO
+export interface ProductInfoVO {
+  id: number // id
+  code: string // 产品编码
+  name: string // 产品名称
+  brandId: number // 品牌
+  productTypeId: number // 产品类型id
+  enabled: boolean // 启用状态
+  remark: string // 备注
+  details: string // 详情介绍
+  cover: string // 封面
+  draftDesignList: string, // 设计稿列表
+  draftDesignDataId: string // 设计稿数据id
+}
+
+// 产品资料  API
+export const ProductInfoApi = {
+  // 查询产品资料 分页
+  getProductInfoPage: async (params: any) => {
+    return await request.get({ url: `/oms/product-info/page`, params })
+  },
+
+  // 查询产品资料 详情
+  getProductInfo: async (id: number) => {
+    return await request.get({ url: `/oms/product-info/get?id=` + id })
+  },
+
+  // 新增产品资料 
+  createProductInfo: async (data: ProductInfoVO) => {
+    return await request.post({ url: `/oms/product-info/create`, data })
+  },
+
+  // 修改产品资料 
+  updateProductInfo: async (data: ProductInfoVO) => {
+    return await request.put({ url: `/oms/product-info/update`, data })
+  },
+
+  // 删除产品资料 
+  deleteProductInfo: async (id: number) => {
+    return await request.delete({ url: `/oms/product-info/delete?id=` + id })
+  },
+
+  // 导出产品资料  Excel
+  exportProductInfo: async (params) => {
+    return await request.download({ url: `/oms/product-info/export-excel`, params })
+  },
+}

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/BrandDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled" ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
 
     <template #footer>

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/BrandDataListDialog/config.data.ts

@@ -68,6 +68,7 @@ const crudSchemas = reactive<CrudSchema[]>([
     dictClass: 'string',
     search: {
       show: true,
+
     },
     form: {
       component: 'SelectV2'

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/BrandDataListDialog/index.vue

@@ -1,6 +1,7 @@
 <template>
   <slot>
     <div>
+
       <el-input
         v-model="that.showValue"
         clearable
@@ -16,10 +17,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -107,7 +109,7 @@ const dialogTitle = ref('设计稿件') // 弹窗的标题
 
 const props = defineProps({
   modelValue: {
-    type: [String],
+    type: String,
     required: true
   },
   dataKey: {
@@ -162,13 +164,18 @@ const viewDetails = () => {
   } else {
     openDialog();
   }
-  console.log("viewDetails", viewDetails)
 }
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
@@ -206,7 +213,6 @@ const initInput = async () => {
 }
 watch(() => props.visible, (newVal) => {
   that.visible = newVal;
-
 })
 const clearData = () => {
   that.inputVal = '';
@@ -233,8 +239,18 @@ const updateValue = () => {
 const selectionChange = (row) => {
   if (row && row.length > 0) {
     if (props.multiple) {
-      that.inputVal = row.map(item => item[props.dataKey || 'id']).join(',')
-      that.showValue = row.map(item => item[props.showKey || 'id']).join(',')
+      let valArr = [];
+      let showArr = [];
+      for (let i = 0; i < row.length; i++) {
+        const tmp =  row[i][props.dataKey || 'id']
+        if(valArr.includes(tmp)){
+          continue;
+        }
+        valArr.push( tmp)
+        showArr.push(row[i][props.showKey || 'id'])
+      }
+      that.inputVal = valArr.join(',')
+      that.showValue = showArr.join(',')
     } else {
       if (row.length > 1) {
         useMessage().warning('单选数据，已忽略其他')

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/Dialog.vue

@@ -26,7 +26,7 @@ const getBindValue = computed(() => {
   return obj
 })
 
-const isFullscreen = ref(false)
+const isFullscreen = ref(props.fullscreen)
 
 const toggleFull = () => {
   isFullscreen.value = !unref(isFullscreen)

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/DraftDesignDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled"  ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" >
     <template #enabled="form">
       <el-radio-group v-model="form['enabled']">

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/DraftDesignDataListDialog/config.data.ts

@@ -48,6 +48,7 @@ const crudSchemas = reactive<CrudSchema[]>([
     dictClass: 'string',
     search: {
       show: true,
+
     },
     form: {
       component: 'SelectV2'

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/DraftDesignDataListDialog/index.vue

@@ -1,6 +1,7 @@
 <template>
   <slot>
     <div>
+
       <el-input
         v-model="that.showValue"
         clearable
@@ -17,10 +18,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -165,13 +167,20 @@ const viewDetails = () => {
   }
   console.log("viewDetails", viewDetails)
 }
-
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
+
+
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
     return `${data}`
@@ -228,10 +237,12 @@ const submit = () => {
   updateVisible(false)
 }
 const updateValue = () => {
+  console.log("that.inputVal",that.inputVal)
   emit("update:modelValue", that.inputVal)
 }
 //
 const selectionChange = (row) => {
+  console.log("row",row)
   if (row && row.length > 0) {
     if (props.multiple) {
       that.inputVal = row.map(item => item[props.dataKey || 'id']).join(',')

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/ProductTypeDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled" ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
 
     <template #footer>

hangtag-ui/hangtag-ui-admin/src/components/Dialog/src/ProductTypeDataListDialog/index.vue

@@ -16,10 +16,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -165,12 +166,19 @@ const viewDetails = () => {
   }
   console.log("viewDetails", viewDetails)
 }
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
+
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
     return `${data}`

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPreviewDialog.vue

@@ -3,12 +3,19 @@
     v-model="that.previewVisible"
     title="预览"
     width="80vw"
-    top="20px"
+    top="2%"
+    :fullscreen="true"
     append-to-body
     @close="updateVisible(false)">
     <div v-loading="that.loading">
       <DesignPropEdit  ref="designPropEditRef" />
     </div>
+    <template #footer>
+        <span class="dialog-footer">
+        <el-button @click="updateVisible(false)">取 消</el-button>
+        <el-button type="primary" @click="submit">确 定</el-button>
+      </span>
+    </template>
   </Dialog>
 </template>
 
@@ -53,6 +60,11 @@ const previewByDraftDesignId = (id: string | number,prop={})=>{
     that.loading = false;
   },300)
 }
+const submit = ()=>{
+ const res = designPropEditRef.value.getPropInfo()
+  console.log("@@",res)
+  updateVisible(false)
+}
 defineExpose({
   preview,
   previewByProductId,

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable vue/this-in-template -->
 <template>
-  <div style="max-height: 90vh; overflow:auto;">
+  <div style="max-height: 90vh; overflow:auto;" v-loading="loading">
      <span>
          仅供参考(for reference only),绿色边框属于边界
        </span>
@@ -22,75 +22,66 @@
       </el-select>
       <el-button @click="that.currentZoom += 1" :disabled="that.currentZoom >= 30">+
       </el-button>
-    </div>
-    <div style="display: flex; flex-wrap: wrap;">
+      <el-checkbox style="margin: 8px" v-model="that.reView">实时预览</el-checkbox>
+      <el-button
+        v-show="!that.reView"
+        style="margin: 8px"
+        type="primary"
+        size="small"
+        @click="updateDesign">
+        <span>更新</span>
+        <span
+          style="color: #ff0000;font-size: 20px; padding-left: 4px">{{
+            that.changeCount > 0 ? '*' : ''
+          }}</span>
+      </el-button>
 
+    </div>
+    <div v-if="that.sizeInfo" style="margin-left: 60px" :title="`${that.sizeInfo.width}mm`">
+      <span>
+        宽:{{ that.sizeInfo.width }}mm
+      </span>
+    </div>
+    <div
+      style="display: flex;">
+      <div v-if="that.sizeInfo" :title="`${that.sizeInfo.height}mm`">
+      <span class="vertical-text">
+        高{{ that.sizeInfo.height }}
+      </span>
+        <span>mm</span>
+      </div>
       <div v-if="that.previewUrl" style="margin: 2px; box-shadow: 0 0 1px 1px rgb(0,255,0)">
         <el-image
+          :title="showImgTitle"
           @click="imagePreview(that.previewUrl)"
           v-loading="loading"
           :src="that.previewUrl"/>
       </div>
-      <div v-if="that.propOrderByList && that.propOrderByList.length > 0">
+
+      <div style="width: 100%" v-if="that.propOrderByList && that.propOrderByList.length > 0">
         <el-scrollbar height="600px">
-          <el-form label-width="280px">
+          <el-form label-width="180px">
+            <el-form-item label="风格主题" v-show="that.draftDesignList.length > 1">
+              <div class="flex ml-3">
+                <div>
+                  <el-select class="min-w-100" v-model="that.draftDesignId" @change="changeType">
+                    <el-option
+                      v-for="(item) in that.draftDesignList"
+                      :key="item.id"
+                      :label="item.label"
+                      :value="item.id"
+                    />
+                  </el-select>
+                </div>
+              </div>
+            </el-form-item>
+
             <el-form-item
               v-for="(tmp) in  that.propOrderByList"
               :key="tmp.key"
               :label="getLabelName(that.propInfo[tmp.key])">
-              <div v-if="that.propInfo[tmp.key].shape === ShapeType.vueTextCell">
+              <div v-if="!that.propInfo[tmp.key].isCombo">
                 <div
-                  v-if="that.propInfo[tmp.key].isCombo && that.propInfo[tmp.key].dataInfo.length === 2">
-                  <!--               图片文本 组合-->
-                  <div style="display: flex">
-
-                    <div style="display: flex;align-items: center;">
-                      <div>
-                        <i
-                          v-if="that.propInfo[tmp.key].canInput"
-                          class="icon-lk_edit"
-                          style="font-size: 20px"> </i>
-                        <i v-else class="icon-lk_cell_add" style="font-size: 20px"> </i>
-                      </div>
-                      <el-select-v2
-                        v-model="that.propInfo[tmp.key].dataInfo[0].label"
-                        filterable
-                        :options="that.washingInfoList"
-                        placeholder="Please select"
-                        @change="changeComboData(that.propInfo[tmp.key],that.propInfo[tmp.key].dataInfo[0].label)"
-                        size="large"
-                        style="min-width: 280px;width: 100%"
-                      >
-                        <template #default="{ item }">
-                          <div style="display: flex;">
-                            <img :src="item.url" width="30px" height="30px"/>
-                            <span>
-                                {{ item.label }}
-                              </span>
-                          </div>
-                        </template>
-                      </el-select-v2>
-                    </div>
-                    <div class="img-box">
-                      <div>
-                        <img
-                          :src="that.propInfo[tmp.key].dataInfo[1].url"
-                          width="60px"
-                          height="60px"/>
-                      </div>
-                    </div>
-                    <div>
-                      <el-button
-                        v-if="that.propInfo[tmp.key].canChange"
-                        @click="deleteList(info,-1)">
-                        <i class="icon-lk_delete"> </i>
-                      </el-button>
-                    </div>
-                  </div>
-                </div>
-
-                <div
-                  v-else
                   v-for="(text,index) in that.propInfo[tmp.key].dataInfo"
                   :key="index"
                   style="padding: 4px">
@@ -115,25 +106,45 @@
 
                     <el-select-v2
                       v-else
-                      v-model="that.propInfo[tmp.key].dataInfo[index].label"
+                      v-model="that.propInfo[tmp.key].dataInfo[index].showLabel"
                       filterable
-                      :options="that.ingredientInfoList"
+                      :options="getIngredientInfoListByType(that.propInfo[tmp.key].groupType)"
                       placeholder="Please select"
-                      @change="changeData"
+                      @change="changeData(index,tmp.key)"
                       size="large"
                       style="min-width: 280px;width: 100%"
                     />
+                    <div v-if="that.propInfo[tmp.key].groupType === '1'">
 
-
+                      <div
+                        style="display: flex;align-items: center; margin-left: 10px; width: 220px">
+                        <el-row>
+                          <el-col span="4">
+                            <div>占比</div>
+                          </el-col>
+                          <el-col span="14">
+                            <el-input-number
+                              :min="-1" :max="100"
+                              v-model="that.propInfo[tmp.key].dataInfo[index].ratio"
+                              @change="changeData(index,tmp.key)"
+                            />
+                          </el-col>
+                          <el-col span="4">
+                            <div> %</div>
+                          </el-col>
+                        </el-row>
+                      </div>
+                    </div>
                     <el-button
                       v-if="that.propInfo[tmp.key].canChange"
-                      @click="deleteList(info,index)">
+                      @click="deleteList(that.propInfo[tmp.key],index)">
                       <i class="icon-lk_delete"> </i>
                     </el-button>
                   </div>
                 </div>
 
-                <el-button v-if="that.propInfo[tmp.key].canChange" @click="appendList(info)">
+                <el-button v-if="that.propInfo[tmp.key].canChange"
+                           @click="appendList(that.propInfo[tmp.key])">
                   添加
                 </el-button>
               </div>
@@ -142,19 +153,39 @@
                 <div
                   v-for="(img,index) in that.propInfo[tmp.key].dataInfo"
                   :key="index" style="display: flex">
-                  <div class="img-box">
-                    <div>
+                  <div class="img-box" v-if="img.url">
+                    <div style="display: flex">
                       <img :src="img.url" width="60px" height="60px"/>
+                      <el-select-v2
+                        v-model="that.propInfo[tmp.key].dataInfo[0].showLabel"
+                        filterable
+                        :options="washingInfoListByType(that.propInfo[tmp.key].groupType)"
+                        placeholder="Please select"
+                        @change="changeComboData(that.propInfo[tmp.key],that.propInfo[tmp.key].dataInfo[0].showLabel)"
+                        size="large"
+                        style="min-width: 280px;width: 100%"
+                      >
+                        <template #default="{ item }">
+                          <div style="display: flex;">
+                            <img :src="item.url" width="30px" height="30px"/>
+                            <span>
+                                {{ item.label }}
+                              </span>
+                          </div>
+                        </template>
+                      </el-select-v2>
                     </div>
                   </div>
-                  <el-button>
-                    <i class="icon-lk_image"></i>
-                  </el-button>
-                  <el-button @click="deleteList(info,index)">
+                  <div v-else-if="img.label">
+                    <el-input v-model="img.label" disabled/>
+                  </div>
+                  <el-button v-if="that.propInfo[tmp.key].canChange"
+                             @click="deleteList(that.propInfo[tmp.key],index)">
                     <i class="icon-lk_delete"> </i>
                   </el-button>
                 </div>
-                <el-button @click="appendList(info)">
+                <el-button v-if="that.propInfo[tmp.key].canChange"
+                           @click="appendList(that.propInfo[tmp.key])">
                   添加
                 </el-button>
 
@@ -163,7 +194,6 @@
             </el-form-item>
           </el-form>
         </el-scrollbar>
-
       </div>
     </div>
 
@@ -187,13 +217,16 @@ import {replaceDomain} from "@/utils";
 import * as FileApi from "@/api/infra/file";
 import {useLocaleStore} from "@/store/modules/locale";
 import {ProductInfoApi} from "@/api/oms/productinfo";
+
 // 动态属性配置
 const localeStore = useLocaleStore()
 const emit = defineEmits(['change'])
 const draftDesignEditRef = ref()
 const that = reactive({
   propInfo: {
-    groupName: '', // 父节点名称
+    reView: true,
+    groupName: '', // 节点名称
+    groupType: '1', //
     isCombo: false, // 是否是组合节点
     minSize: 1,
     maxSize: 100,
@@ -205,9 +238,15 @@ const that = reactive({
     shape: '', // 图形类型
   },
   propOrderByList: [],
-  currentZoom: 6,
+  draftDesignList: [],
+  draftDesignId: '',
+  reView: false,
+  currentZoom: 1,
+  changeCount: 0,
   previewUrl: "",
   ingredientInfoList: [],
+  sizeInfo: null,
+  brandId: null,
   washingInfoList: [],
   pageConfig: {
     background: null,
@@ -215,7 +254,11 @@ const that = reactive({
   data: {},
   show: false,
 })
-
+const showImgTitle = computed(() => {
+  if (that.sizeInfo) {
+    return '宽:' + that.sizeInfo.width + 'mm  高:' + that.sizeInfo.height + 'mm'
+  }
+})
 const zoomList = [
   {
     value: 1,
@@ -268,21 +311,59 @@ const getLabelName = (item) => {
   return item.groupName + ":"
 }
 const loading = ref(false);
-const changeData = () => {
-  console.log("that.propInfo", that.propInfo)
-  resetData();
-}
-const changeComboData = (item: any, label: string) => {
-  for (let i = 0; i < that.washingInfoList.length; i++) {
-    // @ts-ignore
-    if (that.washingInfoList[i].value === label) {
-      // @ts-ignore
-      item.dataInfo[1].url = that.washingInfoList[i].url
+const changeData = (index, key) => {
+  const info = that.propInfo[key];
+  const infoList = getIngredientInfoListByType(info.groupType)
+  for (let i = 0; i < infoList.length; i++) {
+    if (infoList[i].value === infoList[i].label) {
+      console.log("infoList[i]", infoList[i])
+      const arr = infoList[i].langMapping as Array<any>;
+      let value = '';
+      if (infoList[i].isCombo) {
+        for (let j = 0; j < arr.length; j++) {
+          if (j > 0) {
+            value += arr[j].linkChar || ''
+          }
+          let str = that.propInfo[key].dataInfo[index].ratio;
+          if (str === null || str === undefined || str === -1) {
+            str = ''
+          }
+          value += `${arr[j].value}`.replaceAll('${r}', str)
+        }
+      }
+
+      that.propInfo[key].dataInfo[index].label = value;
       break;
     }
   }
   resetData();
 }
+const changeComboData = (item: any, label: string) => {
+  let info = [];
+  for (let i = 0; i < that.washingInfoList.length; i++) {
+    // @ts-ignore
+    if (that.washingInfoList[i].value === label) {
+      // @ts-ignore
+      item.dataInfo[0].url = that.washingInfoList[i].url
+      info = that.washingInfoList[i].langMapping
+      break;
+    }
+  }
+  for (let i = 0; i < info.length; i++) {
+    if (i + 1 >= item.dataInfo.length) {
+      break;
+    }
+    item.dataInfo[i + 1].label = info[i].value
+  }
+  resetData();
+}
+
+const washingInfoListByType = (type) => {
+  return that.washingInfoList.filter(item => item.type === type)
+}
+const getIngredientInfoListByType = (type) => {
+  return that.ingredientInfoList.filter(item => item.type === type)
+}
 
 const deleteList = (item, index) => {
   item.dataInfo.splice(index, 1)
@@ -293,6 +374,7 @@ const appendList = (item) => {
     {
       label: '',
       url: '',
+      ratio: 0,
       ...item.dataInfo[item.dataInfo.length - 1]
     }
   )
@@ -313,11 +395,14 @@ const formData = ref({
 // 预览 图稿id
 const previewByDraftDesignId = async (id: string | number, propData = {}) => {
   if (id) {
+    loading.value = true
+    that.draftDesignId = +id;
     const res = await DraftDesignDataApi.getDraftDesignData(id)
     if (res) {
       formData.value = res
       const j = formData.value.details || "{}"
       const d = JSON.parse(j)
+      console.log("propData", propData)
       loadConfig(d, propData);
     } else {
       useMessage().error('获取数据不存在:' + id)
@@ -325,67 +410,82 @@ const previewByDraftDesignId = async (id: string | number, propData = {}) => {
   }
 }
 // 预览 根据商品id
-const previewByProductId = async (id: string | number, propData = {}) => {
+const previewByProductId = async (id: string | number, propData = {}, defDraftDesignId = null) => {
   if (id) {
     const prodRes = await ProductInfoApi.getProductInfo(id)
     if (!prodRes.draftDesignDataId) {
       useMessage().error('商品未关联设计图稿数据:' + id)
       return;
     }
-    const res = await DraftDesignDataApi.getDraftDesignData(prodRes.draftDesignDataId)
-    if (res) {
-      formData.value = res
-      const j = formData.value.details || "{}"
-      const d = JSON.parse(j)
-      loadConfig(d, propData);
-    } else {
-      useMessage().error('获取数据不存在:' + id)
-    }
+    that.brandId = prodRes.brandId
+    console.log("prodRes", prodRes)
+    that.draftDesignList = JSON.parse(prodRes.draftDesignList, '[]')
+    that.draftDesignId = defDraftDesignId || prodRes.draftDesignDataId
+    await previewByDraftDesignId(that.draftDesignId, propData)
   }
 }
 const loadConfig = (config: object, propData = {}) => {
-  console.log("config", config)
+
   that.pageConfig = config.pageConfig
   that.data = config.data
-  that.propInfo = propData
+  that.propInfo = {...propData}
+
+  that.sizeInfo = that.pageConfig.editArea
   // true, conf.pageConfig, conf.data, test
   draftDesignEditRef.value.init(false, that.pageConfig, that.data, that.propInfo)
-  showPng();
   queryUseLabel();
+  // 延时加载图片
+  setTimeout(()=>{
+    that.currentZoom = 6;
+    loading.value = false
+  },800)
+
 }
 const queryUseLabel = (label) => {
   FileApi.getDomain().then(domain => {
-    ProductCareItemApi.getProductCareItemPage({
+    ProductCareItemApi.queryList({
       pageNo: 1,
       pageSize: 100,
       value: label,
+      type: '1,3,4,5',
+      brandIds: that.brandId,
+      isAll: true,
       locale: currentLocale.value.lang,
-      isCombo: false,
     }).then((data) => {
       that.ingredientInfoList = [];
       if (data.list) {
+
         that.ingredientInfoList = data.list.map((item) => {
           return {
             value: item.value,
             label: item.value,
+            type: item.type,
+            isCombo: item.isCombo,
+            langMapping: JSON.parse(item.langMapping || '{}'),
             url: ''
           }
         })
       }
     })
-    ProductCareItemApi.getProductCareItemPage({
+    ProductCareItemApi.queryList({
       pageNo: 1,
       pageSize: 100,
       value: label,
+      brandIds: that.brandId,
+      isAll: true,
       locale: currentLocale.value.lang,
-      isCombo: true,
+      type: '2'
     }).then((data) => {
       that.washingInfoList = [];
+
       if (data.list) {
         that.washingInfoList = data.list.map((item) => {
           return {
             value: item.value,
             label: item.value,
+            type: item.type,
+            isCombo: item.isCombo,
+            langMapping: JSON.parse(item.langMapping || '{}'),
             url: replaceDomain(domain, item.iconUrl)
           }
         })
@@ -401,10 +501,15 @@ const showPng = () => {
       draftDesignEditRef.value.toPngUrl((url) => {
         that.previewUrl = url
         const info = draftDesignEditRef.value.getPropInfo();
-        console.log("info", info)
-        that.propInfo = info.propDefault;
+
+        that.propInfo = {
+          ...info.propDefault,
+          ...that.propInfo || {}
+        };
         that.propOrderByList = info.propOrderByList;
-        submit();
+        setTimeout(() => {
+          submit();
+        }, 100)
         loading.value = false;
       }, {
         widthScale: that.currentZoom,
@@ -416,18 +521,34 @@ const showPng = () => {
 
 }
 const resetData = () => {
+  if (that.reView) {
+    updateDesign();
+  } else {
+    that.changeCount++;
+  }
+}
+const updateDesign = () => {
+  that.changeCount = 0;
   setTimeout(() => {
     draftDesignEditRef.value.init(false, that.pageConfig, that.data, that.propInfo)
     showPng();
   }, 100)
 }
-
+const changeType = () => {
+  previewByDraftDesignId(that.draftDesignId, that.propInfo)
+}
 const getPropInfo = () => {
-  return that.propInfo;
+  return {
+    draftDesignData: draftDesignEditRef.value.getJson(),
+    // 设计稿id
+    draftDesignId: that.draftDesignId,
+    propInfo: that.propInfo
+  };
 }
 const submit = () => {
   const info = getPropInfo();
   emit('change', info)
+
 }
 onMounted(() => {
 })
@@ -435,11 +556,16 @@ defineExpose({
   previewByDraftDesignId,
   previewByProductId,
   loadConfig,
-  getPropInfo
+  getPropInfo,
 })
 </script>
 
 <style lang="scss" scoped>
+.vertical-text {
+  writing-mode: vertical-rl; /* 垂直排版，从右到左 */
+  text-orientation: upright; /* 保持文字直立 */
+  padding: 6px;
+}
 
 :deep(.el-input__wrapper) {
   position: relative;

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DynamicPropConfig.vue

@@ -3,10 +3,11 @@
     v-model="that.show"
     title="动态属性配置"
     width="60vw"
+    top="2%"
     draggable
     append-to-body
     @close="updateVisible(false)">
-    <div style="width: 100%">
+    <div style="width: 100%; max-height: 75vh">
       <el-alert
         title="动态属性配置说明"
         type="info"
@@ -29,7 +30,18 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <el-form-item label="控制">
+        <el-form-item label="保养类型" >
+          <el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
+            <el-option
+              v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
+              :key="`${dict.value}`"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+<!--       停用 -->
+        <el-form-item label="控制" v-if="false">
           <el-row>
             <el-col :span="12">
              <div style="width: 120px;display: flex">
@@ -89,7 +101,7 @@
                   <el-col :span="2">{{ index + 1 }}</el-col>
                   <el-col :span="11">
                    <span><span v-if="that.configInfo.isCombo" style="padding-right: 4px">
-                     {{ index === 0 ? 'text' : 'icon' }}
+                     {{index !== 0  ? 'text' : 'icon' }}
                    </span> X向右</span>
                     <el-input-number v-model="that.configInfo.pointList[index].x"/>
                   </el-col>
@@ -98,7 +110,7 @@
                       <span
                         v-if="that.configInfo.isCombo"
                         style="padding-right: 4px">
-                        {{ index === 0 ? 'text' : 'icon' }}
+                        {{ index !== 0 ? 'text' : 'icon' }}
                       </span>
                       Y向下</span>
                     <el-input-number v-model="that.configInfo.pointList[index].y"/>
@@ -125,6 +137,8 @@ import {ElAlert} from "element-plus";
 import {reactive, computed, watch} from 'vue'
 import {calculateVectorDifference} from "@/components/DraftDesign/utils/FuncUtil";
 import {useMessage} from "@/hooks/web/useMessage";
+import {DICT_TYPE, getStrDictOptions} from "@/utils/dict";
+import {ShapeType} from "../config";
 // 动态属性配置
 
 const emit = defineEmits(['update:visible', 'submit'])
@@ -134,6 +148,7 @@ const that = reactive({
   show: false,
   configInfo: {
     groupName: '', // 父节点名称
+    groupType: '1',
     isCombo: false, // 是否是组合节点
     minSize: 1,
     maxSize: 100,
@@ -184,9 +199,10 @@ const append = (count = 1) => {
 }
 const init = (allGroupList, data) => {
   that.allGroupList = allGroupList;
-
+  console.log("data",data)
   that.configInfo = {
     groupName: '', // 父节点名称
+    groupType: '1',
     groupId: `g_${Math.random().toString(36).substring(2)}`,
     isCombo: false, // 是否是组合节点
     minSize: 1, // 节点组最小数量

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/index.vue

@@ -94,7 +94,8 @@
       <template #default>
         <div>
           <span style="font-size: 0.8rem;color: #b5b3b3">将关键必要属性进行排序，让布局更清晰</span>
-          <span style="font-size: 0.8rem;color: #b5b3b3">按下鼠标左键进行拖拽进行排序，拖拽结束后，即可生效。</span>
+          <span
+            style="font-size: 0.8rem;color: #b5b3b3">按下鼠标左键进行拖拽进行排序，拖拽结束后，即可生效。</span>
           <Draggable
             style="display: flex; flex-direction: column; align-items: center;"
             ghost-class="draggable-ghost"
@@ -107,11 +108,14 @@
           >
             <template #item="{ element,index }">
               <div class="order-by-item">
-                <span style="padding: 4px">{{index+1}}</span>
-                <i v-if="element.shape === ShapeType.vueShapeImage" class="icon-lk_image" title="icon属性"> </i>
+                <span style="padding: 4px">{{ index + 1 }}</span>
+                <i
+                  v-if="element.shape === ShapeType.vueShapeImage"
+                  class="icon-lk_image"
+                  title="icon属性"> </i>
                 <i v-else-if="element.isCombo" class="icon-lk_cell_add" title="组合属性"> </i>
                 <i v-else class="icon-lk_text"> </i>
-                <span style="padding: 4px;">{{element.name}}</span>
+                <span style="padding: 4px;">{{ element.name }}</span>
 
               </div>
             </template>
@@ -120,7 +124,7 @@
       </template>
     </el-dialog>
 
-    <el-container >
+    <el-container>
       <el-header class="top-tool-bar" v-show="layout.draftDesignState">
         <div style="display: flex;align-items: center;height: 100%;">
           <div style="background-color: #34bfa3;width: 68px;height: 100%;">
@@ -248,7 +252,7 @@
               <el-button
                 title="清空Clear"
                 @click="btnChange('clearData',true)"
-                >
+              >
                 <i class="icon-lk_delete"></i>
               </el-button>
             </div>
@@ -275,7 +279,7 @@
                 :width="60"
                 :effect="that.effect"
                 trigger="hover"
-                content="lineColor"
+                content="backgroundColor"
               >
                 <template #reference>
                   <ColorPickerTool
@@ -294,7 +298,7 @@
                 :width="60"
                 :effect="that.effect"
                 trigger="hover"
-                content="lineColor"
+                content="FillColor"
               >
                 <template #reference>
                   <div>
@@ -339,6 +343,46 @@
                 </template>
               </el-popover>
             </div>
+            <div v-if="hasKey(that.cellInfo, 'data.style.shape.strokeDasharray')">
+              <el-popover
+                placement="bottom-start"
+                :width="60"
+                :effect="that.effect"
+                trigger="hover"
+                content="示例: 10,5 说明:线条将交替绘制 10 像素长的线段和 5 像素长的间隙，重复这个模式"
+              >
+                <template #reference>
+                  <div>
+                    <el-select
+                      v-model="that.cellInfo.data.style.shape.strokeDasharray"
+                      @change="changeCellInfo(undefined)"
+                      style="width: 120px">
+                      <el-option
+                        v-for="item in strokeDasharrayList" :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                        <template #default>
+                          <div :title="item.value">
+                            <svg width="120" height="20">
+                              <!-- 使用路径绘制一条虚线 -->
+                              <line
+                                x1="10"
+                                y1="10"
+                                x2="190"
+                                y2="10"
+                                stroke="black"
+                                stroke-width="2"
+                                :stroke-dasharray="item.value"/>
+                            </svg>
+                          </div>
+                        </template>
+
+                      </el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-popover>
+            </div>
 
             <div v-if="hasKey(that.cellInfo, 'data.style.shape.strokeWidth')">
               <el-popover
@@ -557,6 +601,10 @@
               >
                 <template #default>
                   <div>
+                    <div v-if="hasKey(that.cellInfo, 'data.style.text.overflow')">
+                      <el-checkbox @change="changTextHide" v-model="that.isHidden">超出隐藏
+                      </el-checkbox>
+                    </div>
                     <div style="display: flex;flex-wrap: wrap;margin: auto">
                       <div v-for="btn in alignBtnList" :key="btn.key">
 
@@ -652,11 +700,11 @@
       </el-header>
       <el-container>
         <div v-show="layout.draftDesignState">
-          <DraftDesignLeftPanel  @on-add-node="handlerAddNode"/>
+          <DraftDesignLeftPanel @on-add-node="handlerAddNode"/>
         </div>
 
         <el-container>
-          <el-main class="center-panel" >
+          <el-main class="center-panel">
             <div>
               <slot>
                 <div>main</div>
@@ -665,10 +713,15 @@
             </div>
           </el-main>
           <el-footer class="bottom-tool-bar">
-            <div style="display: flex; align-items: center; height: 100%;justify-content: flex-end;">
+            <div
+              style="display: flex; align-items: center; height: 100%;justify-content: flex-end;">
               <div v-show="layout.draftDesignState">
                 <div>
-                  <el-button :type="layout.rightPanelOpen ? 'primary' : ''"  @click="changeRightPanel"><i class="icon-lk_layer_set" style="font-size: 1.2rem"></i></el-button>
+                  <el-button
+                    :type="layout.rightPanelOpen ? 'primary' : ''"
+                    @click="changeRightPanel">
+                    <i class="icon-lk_layer_set" style="font-size: 1.2rem"></i>
+                  </el-button>
                 </div>
               </div>
               <div>
@@ -696,7 +749,10 @@
 
           </el-footer>
         </el-container>
-        <DraftDesignRightPanel  v-show="layout.draftDesignState"  ref="draftDesignRightPanelRef" @click-item="clickItem" />
+        <DraftDesignRightPanel
+          v-show="layout.draftDesignState"
+          ref="draftDesignRightPanelRef"
+          @click-item="clickItem"/>
       </el-container>
 
     </el-container>
@@ -718,7 +774,7 @@ import {
   ElSelectV2
 } from "element-plus";
 
-import { computed, watch, onMounted} from 'vue'
+import {computed, watch, onMounted} from 'vue'
 import {nextId} from "@/components/DraftDesign/utils/FuncUtil";
 import {useDebounceFn} from '@vueuse/core'
 import Draggable from 'vuedraggable'
@@ -748,7 +804,7 @@ const onClickOutSize = () => {
 }
 
 
-const hasKey = (obj:any, path:string) => {
+const hasKey = (obj: any, path: string) => {
   if (!obj || !path) return null;
   const keys = path.split('.');
   let result = obj;
@@ -763,11 +819,11 @@ const hasKey = (obj:any, path:string) => {
   }
   return false;
 }
-const topBtnClick = (btn:any) => {
+const topBtnClick = (btn: any) => {
   btn.handler();
   changeCellInfo()
 }
-const changePageColor = (val:any, key:string) => {
+const changePageColor = (val: any, key: string) => {
   const split = key.split(".");
   if (split.length === 1) {
     that.pageConfig[split[0]] = val;
@@ -781,7 +837,7 @@ const changePageColor = (val:any, key:string) => {
   changePageConfig()
 }
 
-const changeColor = (val:any, key:string) => {
+const changeColor = (val: any, key: string) => {
   const split = key.split(".");
   if (split.length === 1) {
     that.cellInfo[split[0]] = val;
@@ -794,6 +850,68 @@ const changeColor = (val:any, key:string) => {
   }
   changeCellInfo()
 }
+const strokeDasharrayList = [
+  {
+    value: '5,5',
+    label: '5,5' // 简单的短线虚线
+  },
+  {
+    value: '10,10',
+    label: '10,10' // 均匀的中等虚线
+  },
+  {
+    value: '15,15',
+    label: '15,15' // 长线虚线
+  },
+  {
+    value: '20,20',
+    label: '20,20' // 更长的线段和间隔
+  },
+  {
+    value: '3,5,3',
+    label: '3,5,3' // 细碎的虚线风格
+  },
+  {
+    value: '1,3',
+    label: '1,3' // 细小点线
+  },
+  {
+    value: '4,1,2',
+    label: '4,1,2' // 交替短线和间隙
+  },
+  {
+    value: '8,4,2,4',
+    label: '8,4,2,4' // 变换长度的虚线
+  },
+  {
+    value: '12,3,3,3',
+    label: '12,3,3,3' // 长线与短线组合
+  },
+  {
+    value: '5,10',
+    label: '5,10' // 短线与长间隔
+  },
+  {
+    value: '2,2',
+    label: '2,2' // 短线密集虚线
+  },
+  {
+    value: '7,3,1,3',
+    label: '7,3,1,3' // 多段式虚线
+  },
+  {
+    value: '10,2,5,2',
+    label: '10,2,5,2' // 中长线和短间隔组合
+  },
+  {
+    value: '3,1',
+    label: '3,1' // 极细小的点线风格
+  },
+  {
+    value: '6,4,1,4,1,4',
+    label: '6,4,1,4,1,4' // 复杂的点线组合
+  }
+];
 
 const alignBtnList = computed(() => {
   let arr = [];
@@ -1017,7 +1135,7 @@ const angleList = computed(() => {
   const arr = []
   for (let i = 0; i < 360; i++) {
     //@ts-ignore
-    arr.push({ value: i,  label: `${i}` })
+    arr.push({value: i, label: `${i}`})
   }
   return arr
 })
@@ -1147,7 +1265,8 @@ const that = reactive({
   showDialog: false,
   showOrderByDialog: false,
   sizeMode: '',
-  propList: [ ],
+  propList: [],
+  isHidden: false,
   borderAngle: [0, 0, 0, 0],
   pageConfig: {
     background: {
@@ -1223,6 +1342,13 @@ const defaultSizeChange = (val) => {
     that.showDialog = false
   }
 
+}
+const changTextHide = () => {
+  if (hasKey(that.cellInfo, 'data.style.text.overflow')) {
+    that.cellInfo.data.style.text.overflow = that.isHidden ? 'hidden' : 'visible';
+    changeCellInfo()
+  }
+
 }
 const changePos = (p: 'x' | 'y') => {
   changeCellInfo({
@@ -1233,6 +1359,7 @@ const changeSize = () => {
   changeCellInfo()
 }
 const changeCellInfo = (cellPos = undefined) => {
+  console.log("changeCellInfo",)
   emit('changeCell', that.cellInfo, cellPos)
 }
 const changePageConfig = () => {
@@ -1280,6 +1407,9 @@ onMounted(() => {
 
 const selectedNode = (e) => {
   that.cellInfo = {...e};
+  if (hasKey(that.cellInfo, 'data.style.text.overflow')) {
+    that.isHidden = that.cellInfo.data.style.text.overflow === 'hidden'
+  }
   if (hasKey(that.cellInfo, 'data.style.borderRadius')) {
     if (that.cellInfo.data.style.borderRadius) {
       that.borderAngle = [0, 0, 0, 0]
@@ -1337,28 +1467,29 @@ const updatePageConfig = useDebounceFn((conf) => {
   }
 }, 100)
 
-const changeRightPanel = ()=>{
+const changeRightPanel = () => {
   layout.rightPanelOpen = !layout.rightPanelOpen
   updateCellList();
   draftDesignRightPanelRef.value.toggle(layout.rightPanelOpen)
 }
-const updateCellList = ()=>{
-  if(layout.rightPanelOpen){
+const updateCellList = () => {
+  if (layout.rightPanelOpen) {
     let json = layout.graph.toJSON();
     draftDesignRightPanelRef.value.updateList(json.cells)
   }
 }
-const setGraph = (g)=>{
+const setGraph = (g) => {
   layout.graph = g;
   layout.draftDesignState = getDraftDesignState();
 }
-const clickItem = (item)=>{
+const clickItem = (item) => {
   emit('selectCell', item)
 }
-const updatePropList = (propList: any[])=>{
-  that.propList = propList
+const updatePropList = (propList: any[]) => {
+  console.log(" that.propList", propList)
+  that.propList = [...propList]
 }
-const propListChange=()=>{
+const propListChange = () => {
   console.log("propListChange@@")
   emit('propListChange', that.propList)
 }
@@ -1610,10 +1741,12 @@ $panelZIndex: 10;
   overflow: hidden;
   padding: 0;
 }
-.order-by-item:hover{
+
+.order-by-item:hover {
   cursor: move;
 }
-.order-by-item{
+
+.order-by-item {
   margin: 6px;
   border: 1px solid #8e8b8b;
   width: 100%;

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/DottedLineNode.vue

@@ -0,0 +1,221 @@
+<!-- eslint-disable vue/this-in-template -->
+<template>
+  <div
+    :id="cellInfo.id"
+    class="node-content"
+   :class="{ 'node-content-group' : this.cellInfo.editMode && this.cellInfo.propGroupId }"
+    :title="this.cellInfo.propGroupName"
+    v-reSize="changSize">
+
+    <svg
+      style="position: absolute;
+      width: 100%;height: 100%;
+      top: 50%; left: 50%;
+     transform: translate(-50%, -50%) scale(1); "
+    >
+      <line
+            x1="0"
+            y1="8"
+            :x2="sizeWInfo.width"
+            y2="8"
+            :stroke="cellInfo.style.shape.strokeColor"
+            :stroke-width="cellInfo.style.shape.strokeWidth"
+            :stroke-dasharray="cellInfo.style.shape.strokeDasharray" />
+    </svg>
+  </div>
+</template>
+
+<script lang="ts">
+import {defineComponent} from 'vue'
+import {
+  filterUnsafeHtml,
+  getSafeValue,
+  mergeDeepObject,
+  nextId, objectHasKey
+} from "@/components/DraftDesign/utils/FuncUtil";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+
+
+export default defineComponent({
+  name: 'DottedLineNode',
+  computed: {
+    VueCellShapeType() {
+      return VueCellShapeType
+    },
+    minShapeSize() {
+      if (this.cellInfo.style.shape.strokeWidth) {
+        return this.minSize - this.toInt(this.cellInfo.style.shape.strokeWidth)
+      }
+      return this.minSize;
+    },
+    svgStyle() {
+      return {
+
+      };
+    }
+  },
+  // eslint-disable-next-line vue/order-in-components
+  inject: ['getNode'],
+  // eslint-disable-next-line vue/order-in-components
+  data() {
+    return {
+      cellInfo: {
+        id: '',
+        label: '',
+        showInput: false,
+        shape: VueCellShapeType.Rect,
+        style: {
+
+          shape: {
+            strokeColor: '#000000', // 填充颜色
+            strokeWidth: 2, // 描边宽度
+            strokeDasharray: '5,5', // 虚线模式
+          }
+        }
+      },
+      nodeInfo: {
+        store: {
+          data: {
+            data: {
+              label: ''
+            }
+          }
+        }
+      },
+      fontSize: 12,
+      targetElement: null,
+      minSize: 2,
+      sizeWInfo: {
+        width: 0,
+        height: 0,
+      },
+    }
+  },
+
+  mounted() {
+    const node = (this as any).getNode()
+    this.nodeInfo = node
+
+    if (node && node.data) {
+      this.setCellInfo(node.data)
+    }
+    node.on('change:data', ({current}) => {
+
+      this.setCellInfo(current)
+    })
+
+  },
+  unmounted() {
+  },
+  methods: {
+    toInt(val, defaultVal = 0) {
+      try {
+        return parseInt(val)
+      } catch (e) {
+        return defaultVal
+      }
+    },
+    safeHtml(val) {
+      if (val) {
+        val = val.replace(/[\n\r]/g, "<br/>")
+      }
+      return filterUnsafeHtml(val)
+    },
+    inputBlur() {
+      this.cellInfo.showInput = false
+    },
+    inputChange() {
+      if (this.nodeInfo.store && this.nodeInfo.store.data) {
+        // this.nodeInfo.store.data.data.label = this.cellInfo.label
+        this.nodeInfo.store.data.data = {
+          ...this.nodeInfo.store.data.data,
+          ...this.cellInfo
+        }
+      }
+    },
+    setInput(val: boolean) {
+      // this.cellInfo.showInput = val
+    },
+    changSize(size: any) {
+
+      this.sizeWInfo.width = size.width;
+      this.sizeWInfo.height = size.height;
+      this.minSize = Math.min(size.height, size.width)
+      let s = size.height + 12;
+      if (s > 60) {
+        s = s + s / 3
+      }
+      if (s < 6) {
+        s = 6
+      } else if (s >= 1000) {
+        s = 1000
+      }
+
+      this.fontSize = s;
+      this.changeFontSize();
+    },
+    changeFontSize() {
+      this.cellInfo.style.text.fontSize = `${this.fontSize}px`
+    },
+    setCellInfo(info: any) {
+      if (!info) {
+        info = {
+          style: {
+            text: {}
+          }
+        }
+      }
+      this.cellInfo = mergeDeepObject({
+        showInput: false,
+        id: nextId(),
+        label: '',
+        shape: VueCellShapeType.Rect,
+        style: {
+          shape: {
+            strokeColor: '#000000', // 填充颜色
+            strokeWidth: 2, // 描边宽度
+            strokeDasharray: '5,5', // 虚线模式
+          },
+          text: {}
+        }
+      }, info)
+      console.log("setCellInfo@@", this.cellInfo)
+      this.cellInfo.showInput = false;
+      setTimeout(() => {
+        if (this.nodeInfo.store && this.nodeInfo.store.data) {
+          this.nodeInfo.store.data.data = this.cellInfo
+        }
+      }, 300)
+      // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
+      this.setInput(this.cellInfo.showInput)
+      this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
+      this.changeFontSize();
+    }
+
+  }
+})
+</script>
+
+<style scoped lang="scss">
+.node-content {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  display: flex;
+}
+
+</style>

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/LineCellNode.vue

@@ -21,7 +21,7 @@ import {
   mergeDeepObject,
   nextId
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -158,6 +158,20 @@ export default defineComponent({
       }, 300)
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeCellNode.vue

@@ -120,7 +120,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -392,6 +392,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeCircleNode.vue

@@ -63,7 +63,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -246,6 +246,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeEllipseNode.vue

@@ -64,7 +64,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -254,6 +254,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeFivePointedNode.vue

@@ -66,7 +66,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -262,6 +262,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeImageNode.vue

@@ -40,7 +40,7 @@ import {
   mergeDeepObject,
   nextId,
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 import {convertImageToBase64} from "@/components/DraftDesign/utils/Dpi";
 
 
@@ -267,6 +267,20 @@ export default defineComponent({
         }
       }, 300)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeLozengeNode.vue

@@ -67,7 +67,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -286,6 +286,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeRectNode.vue

@@ -73,7 +73,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -265,6 +265,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeRightArrowNode.vue

@@ -67,7 +67,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -292,6 +292,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeRightTriangleNode.vue

@@ -67,7 +67,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -276,6 +276,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeTriangleNode.vue

@@ -68,7 +68,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -277,6 +277,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/TextCellNode.vue

@@ -6,7 +6,7 @@
     :style="{
         'alignItems' :cellInfo.style.alignItems
        }"
-   :class="{ 'node-content-group' : this.cellInfo.editMode && this.cellInfo.propGroupId }"
+     :class="{ 'node-content-group' : this.cellInfo.editMode && this.cellInfo.propGroupId }"
     :title="this.cellInfo.propGroupName"
     v-reSize="changSize">
     <span
@@ -44,15 +44,15 @@ import {
   mergeDeepObject,
   nextId
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState} from "@/components/DraftDesign/config";
 
 export default defineComponent({
   name: 'TextCellNode',
   inject: ['getNode'],
   data() {
     return {
-      textElId: nextId(),
 
+      textElId: nextId(),
       cellInfo: {
         id:  nextId(),
         label: '新文本',
@@ -78,7 +78,8 @@ export default defineComponent({
             textShadow: 'none',
             textOverflow: 'clip',
             whiteSpace: 'normal',
-            wordBreak: 'break-word',
+            wordBreak: 'break-all',
+            whiteSpace: 'pre-wrap',
             wordWrap: 'break-word',
           }
         }
@@ -108,9 +109,7 @@ export default defineComponent({
       this.setCellInfo(current)
     })
   },
-  unmounted() {
 
-  },
   methods: {
     safeHtml(val) {
       if (val) {
@@ -214,6 +213,7 @@ export default defineComponent({
           alignItems: 'start', // start end center
           text: {
             width: `100%`,
+            height: '100%',
             fontSizeVal: 12,
             fontSize: '16px',
             fontWeight: 100,
@@ -228,23 +228,41 @@ export default defineComponent({
             textShadow: 'none',
             textOverflow: 'clip',
             whiteSpace: 'normal',
-            wordBreak: 'break-word',
+            wordBreak: 'break-all',
+            overflow: 'visible', // hidden,
+            whiteSpace: 'pre-wrap',
             wordWrap: 'break-word',
           }
         }
       }, info)
-
       // setTimeout(() => {
       //   if (this.nodeInfo.store && this.nodeInfo.store.data) {
       //     this.nodeInfo.store.data.data = this.cellInfo
       //   }
       // }, 300)
 
+
       this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSizeVal') || '12')
 
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
+
       this.changeFontSize();
     }
 
@@ -253,6 +271,7 @@ export default defineComponent({
 </script>
 
 <style scoped lang="scss">
+
 .node-content {
   width: 100%;
   height: 100%;

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/config/index.ts

@@ -267,6 +267,7 @@ export const predefineColors = [
 export const ShapeType = {
   'vueTextCell': 'vue-node_text_cell',
   'vueLineCell': 'vue-node_line_cell',
+  'vueDottedLineCell': 'vue-node_dotted_line_cell',
   'vueShapeCell': 'vue-node_shape_cell',
   'vueShapeRect': 'vue-node_shape_rect',
   'vueShapeCircle': 'vue-node_shape_circle',
@@ -311,6 +312,21 @@ export const baseShape = [
       return this.label
     }
   },
+  {
+    key: 'dotted_line',
+    shape: ShapeType.vueDottedLineCell,
+    data: {
+      label: 'DottedLine',
+      width: 80,
+      height: 12,
+      style: {}
+    },
+    icon: 'icon-lk_dotted_line',
+    label: 'DottedLine',
+    filterKeyword: function () {
+      return this.label
+    }
+  },
   {
     key: 'shape_rect',
     shape: ShapeType.vueShapeRect,
@@ -496,3 +512,12 @@ export const getDraftDesignState = ()=>{
 export const setDraftDesignState = (editState = null)=>{
   sessionStorage.setItem("draftDesign_editState",editState === true ? 'true' : '')
 }
+
+export const configInfo = {
+  LK_SHOW_RANDOM_GROUP_COLOR: ()=>{
+    return localStorage.getItem('lk_show_random_group_color')
+  },
+  LK_SHOW_RANDOM_GROUP_COLOR_SET: (show:boolean)=>{
+    return localStorage.setItem('lk_show_random_group_color', show ? 'true' : '')
+  }
+}

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/demo.html

@@ -9,10 +9,24 @@
     <link rel="stylesheet" href="style.css"></head>
 <body>
     <div class="bgc1 clearfix">
-        <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;67)</small></h1>
+        <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;68)</small></h1>
     </div>
     <div class="clearfix mhl ptl">
         <h1 class="mvm mtn fgc1">Grid Size: Unknown</h1>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-lk_dotted_line"></span>
+                <span class="mls"> icon-lk_dotted_line</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e943" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe943;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
         <div class="glyph fs1">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-lk_order_by"></span>

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/Read Me.txt

@@ -1,7 +0,0 @@
-Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures.
-
-To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/docs/#local-fonts
-
-You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects.
-
-You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection.

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/demo-files/demo.css

@@ -1,152 +0,0 @@
-body {
-  padding: 0;
-  margin: 0;
-  font-family: sans-serif;
-  font-size: 1em;
-  line-height: 1.5;
-  color: #555;
-  background: #fff;
-}
-h1 {
-  font-size: 1.5em;
-  font-weight: normal;
-}
-small {
-  font-size: .66666667em;
-}
-a {
-  color: #e74c3c;
-  text-decoration: none;
-}
-a:hover, a:focus {
-  box-shadow: 0 1px #e74c3c;
-}
-.bshadow0, input {
-  box-shadow: inset 0 -2px #e7e7e7;
-}
-input:hover {
-  box-shadow: inset 0 -2px #ccc;
-}
-input, fieldset {
-  font-family: sans-serif;
-  font-size: 1em;
-  margin: 0;
-  padding: 0;
-  border: 0;
-}
-input {
-  color: inherit;
-  line-height: 1.5;
-  height: 1.5em;
-  padding: .25em 0;
-}
-input:focus {
-  outline: none;
-  box-shadow: inset 0 -2px #449fdb;
-}
-.glyph {
-  font-size: 16px;
-  width: 15em;
-  padding-bottom: 1em;
-  margin-right: 4em;
-  margin-bottom: 1em;
-  float: left;
-  overflow: hidden;
-}
-.liga {
-  width: 80%;
-  width: calc(100% - 2.5em);
-}
-.talign-right {
-  text-align: right;
-}
-.talign-center {
-  text-align: center;
-}
-.bgc1 {
-  background: #f1f1f1;
-}
-.fgc1 {
-  color: #999;
-}
-.fgc0 {
-  color: #000;
-}
-p {
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
-.mvm {
-  margin-top: .75em;
-  margin-bottom: .75em;
-}
-.mtn {
-  margin-top: 0;
-}
-.mtl, .mal {
-  margin-top: 1.5em;
-}
-.mbl, .mal {
-  margin-bottom: 1.5em;
-}
-.mal, .mhl {
-  margin-left: 1.5em;
-  margin-right: 1.5em;
-}
-.mhmm {
-  margin-left: 1em;
-  margin-right: 1em;
-}
-.mls {
-  margin-left: .25em;
-}
-.ptl {
-  padding-top: 1.5em;
-}
-.pbs, .pvs {
-  padding-bottom: .25em;
-}
-.pvs, .pts {
-  padding-top: .25em;
-}
-.unit {
-  float: left;
-}
-.unitRight {
-  float: right;
-}
-.size1of2 {
-  width: 50%;
-}
-.size1of1 {
-  width: 100%;
-}
-.clearfix:before, .clearfix:after {
-  content: " ";
-  display: table;
-}
-.clearfix:after {
-  clear: both;
-}
-.hidden-true {
-  display: none;
-}
-.textbox0 {
-  width: 3em;
-  background: #f1f1f1;
-  padding: .25em .5em;
-  line-height: 1.5;
-  height: 1.5em;
-}
-#testDrive {
-  display: block;
-  padding-top: 24px;
-  line-height: 1.5;
-}
-.fs0 {
-  font-size: 16px;
-}
-.fs1 {
-  font-size: 32px;
-}
-

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/demo-files/demo.js

@@ -1,30 +0,0 @@
-if (!('boxShadow' in document.body.style)) {
-    document.body.setAttribute('class', 'noBoxShadow');
-}
-
-document.body.addEventListener("click", function(e) {
-    var target = e.target;
-    if (target.tagName === "INPUT" &&
-        target.getAttribute('class').indexOf('liga') === -1) {
-        target.select();
-    }
-});
-
-(function() {
-    var fontSize = document.getElementById('fontSize'),
-        testDrive = document.getElementById('testDrive'),
-        testText = document.getElementById('testText');
-    function updateTest() {
-        testDrive.innerHTML = testText.value || String.fromCharCode(160);
-        if (window.icomoonLiga) {
-            window.icomoonLiga(testDrive);
-        }
-    }
-    function updateSize() {
-        testDrive.style.fontSize = fontSize.value + 'px';
-    }
-    fontSize.addEventListener('change', updateSize, false);
-    testText.addEventListener('input', updateTest, false);
-    testText.addEventListener('change', updateTest, false);
-    updateSize();
-}());

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/demo.html

@@ -1,794 +0,0 @@
-<!doctype html>
-<html>
-<head>
-    <meta charset="utf-8">
-    <title>IcoMoon Demo</title>
-    <meta name="description" content="An Icon Font Generated By IcoMoon.io">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="demo-files/demo.css">
-    <link rel="stylesheet" href="style.css"></head>
-<body>
-    <div class="bgc1 clearfix">
-        <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;54)</small></h1>
-    </div>
-    <div class="clearfix mhl ptl">
-        <h1 class="mvm mtn fgc1">Grid Size: Unknown</h1>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_lozenge"></span>
-                <span class="mls"> icon-lk_lozenge</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e935" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe935;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_set_size"></span>
-                <span class="mls"> icon-lk_set_size</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e933" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe933;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_right_arrow"></span>
-                <span class="mls"> icon-lk_right_arrow</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e934" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe934;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_right_triangle"></span>
-                <span class="mls"> icon-lk_right_triangle</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e932" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe932;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_ellipse"></span>
-                <span class="mls"> icon-lk_ellipse</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92f" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92f;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_rect"></span>
-                <span class="mls"> icon-lk_rect</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e931" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe931;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_triangle"></span>
-                <span class="mls"> icon-lk_triangle</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92c" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92c;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_five_pointed"></span>
-                <span class="mls"> icon-lk_five_pointed</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92e" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92e;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_circle"></span>
-                <span class="mls"> icon-lk_circle</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e930" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe930;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_angular"></span>
-                <span class="mls"> icon-lk_angular</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92b" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92b;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_shape_stroke"></span>
-                <span class="mls"> icon-lk_shape_stroke</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92a" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92a;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_color_palette"></span>
-                <span class="mls"> icon-lk_color_palette</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e92d" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe92d;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_font_size"></span>
-                <span class="mls"> icon-lk_font_size</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e929" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe929;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_icon"></span>
-                <span class="mls"> icon-lk_align_icon</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e928" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe928;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_h_center"></span>
-                <span class="mls"> icon-lk_align_h_center</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e925" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe925;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_bottom"></span>
-                <span class="mls"> icon-lk_align_bottom</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e926" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe926;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_top"></span>
-                <span class="mls"> icon-lk_align_top</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e927" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe927;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_right"></span>
-                <span class="mls"> icon-lk_align_right</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e922" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe922;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_center"></span>
-                <span class="mls"> icon-lk_align_center</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e923" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe923;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_left"></span>
-                <span class="mls"> icon-lk_align_left</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e924" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe924;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_shape_set"></span>
-                <span class="mls"> icon-lk_shape_set</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e921" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe921;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_layer_set"></span>
-                <span class="mls"> icon-lk_layer_set</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e920" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe920;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_border_angle"></span>
-                <span class="mls"> icon-lk_border_angle</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91f" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91f;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_line"></span>
-                <span class="mls"> icon-lk_line</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91e" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91e;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_text"></span>
-                <span class="mls"> icon-lk_text</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91d" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91d;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_warning_tips"></span>
-                <span class="mls"> icon-lk_warning_tips</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91c" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91c;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_data_output"></span>
-                <span class="mls"> icon-lk_data_output</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e919" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe919;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_data_input"></span>
-                <span class="mls"> icon-lk_data_input</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91a" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91a;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_start"></span>
-                <span class="mls"> icon-lk_start</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e91b" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe91b;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_step_flow"></span>
-                <span class="mls"> icon-lk_step_flow</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e918" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe918;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_success"></span>
-                <span class="mls"> icon-lk_success</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e915" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe915;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_failed"></span>
-                <span class="mls"> icon-lk_failed</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e916" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe916;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_running"></span>
-                <span class="mls"> icon-lk_running</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e917" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe917;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_horizontal"></span>
-                <span class="mls"> icon-lk_align_horizontal</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e900" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe900;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_align_vertical"></span>
-                <span class="mls"> icon-lk_align_vertical</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e901" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe901;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_close_x"></span>
-                <span class="mls"> icon-lk_close_x</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e902" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe902;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_color_eyedropper_tool"></span>
-                <span class="mls"> icon-lk_color_eyedropper_tool</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e903" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe903;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_color_fill"></span>
-                <span class="mls"> icon-lk_color_fill</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e904" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe904;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_down"></span>
-                <span class="mls"> icon-lk_down</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e905" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe905;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_file_template"></span>
-                <span class="mls"> icon-lk_file_template</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e906" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe906;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_font_bold"></span>
-                <span class="mls"> icon-lk_font_bold</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e907" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe907;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_font_color"></span>
-                <span class="mls"> icon-lk_font_color</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e908" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe908;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_font_italic"></span>
-                <span class="mls"> icon-lk_font_italic</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e909" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe909;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_icon_config"></span>
-                <span class="mls"> icon-lk_icon_config</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90a" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90a;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_minimap"></span>
-                <span class="mls"> icon-lk_minimap</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90b" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90b;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_open"></span>
-                <span class="mls"> icon-lk_open</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90c" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90c;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_plus_copy"></span>
-                <span class="mls"> icon-lk_plus_copy</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90d" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90d;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_recover"></span>
-                <span class="mls"> icon-lk_recover</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90e" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90e;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_save"></span>
-                <span class="mls"> icon-lk_save</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e90f" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe90f;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_tips"></span>
-                <span class="mls"> icon-lk_tips</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e910" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe910;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_to_center"></span>
-                <span class="mls"> icon-lk_to_center</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e911" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe911;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_undo"></span>
-                <span class="mls"> icon-lk_undo</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e912" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe912;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_zoom_in"></span>
-                <span class="mls"> icon-lk_zoom_in</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e913" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe913;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs1">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-lk_zoom_out"></span>
-                <span class="mls"> icon-lk_zoom_out</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e914" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe914;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-    </div>
-
-    <!--[if gt IE 8]><!-->
-    <div class="mhl clearfix mbl">
-        <h1>Font Test Drive</h1>
-        <label>
-            Font Size: <input id="fontSize" type="number" class="textbox0 mbm"
-            min="8" value="48" />
-            px
-        </label>
-        <input id="testText" type="text" class="phl size1of1 mvl"
-        placeholder="Type some text to test..." value=""/>
-        <div id="testDrive" class="icon-" style="font-family: icomoon">&nbsp;
-        </div>
-    </div>
-    <!--<![endif]-->
-    <div class="bgc1 clearfix">
-        <p class="mhl">Generated by <a href="https://icomoon.io/app">IcoMoon</a></p>
-    </div>
-
-    <script src="demo-files/demo.js"></script>
-</body>
-</html>

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/fonts/icomoon.svg

@@ -1,64 +0,0 @@
-<?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 xmlns="http://www.w3.org/2000/svg">
-<metadata>Generated by IcoMoon</metadata>
-<defs>
-<font id="icomoon" horiz-adv-x="1024">
-<font-face units-per-em="1024" ascent="960" descent="-64" />
-<missing-glyph horiz-adv-x="1024" />
-<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
-<glyph unicode="&#xe900;" glyph-name="lk_align_horizontal" d="M146.286 45.714h-73.143v804.571h73.143zM950.857 630.857h-731.429v219.429h731.429zM804.571 338.286h-585.143v219.429h585.143zM950.857 45.678h-731.429v219.429h731.429z" />
-<glyph unicode="&#xe901;" glyph-name="lk_align_vertical" d="M914.286 82.286v-73.143h-804.571v73.143zM329.143 886.857v-731.429h-219.429v731.429zM621.714 740.571v-585.509h-219.429v585.509zM914.286 886.857v-731.429h-219.429v731.429z" />
-<glyph unicode="&#xe902;" glyph-name="lk_close_x" d="M563.8 448l262.5 312.9c4.4 5.2 0.7 13.1-6.1 13.1h-79.8c-4.7 0-9.2-2.1-12.3-5.7l-216.5-258.1-216.5 258.1c-3 3.6-7.5 5.7-12.3 5.7h-79.8c-6.8 0-10.5-7.9-6.1-13.1l262.5-312.9-262.5-312.9c-4.4-5.2-0.7-13.1 6.1-13.1h79.8c4.7 0 9.2 2.1 12.3 5.7l216.5 258.1 216.5-258.1c3-3.6 7.5-5.7 12.3-5.7h79.8c6.8 0 10.5 7.9 6.1 13.1l-262.5 312.9z" />
-<glyph unicode="&#xe903;" glyph-name="lk_color_eyedropper_tool" d="M994.763 868.259l-62.057 62.057c-18.325 18.314-43.634 29.64-71.589 29.64s-53.264-11.326-71.59-29.641l-144.073-144.073-69.542 69.67-137.804-137.868 57.386-57.322-393.26-393.324c-24.361-24.322-40.077-57.297-42.143-93.921l-0.017-0.379-22.903-22.839c-22.723-22.715-36.778-54.099-36.778-88.767 0-69.319 56.194-125.512 125.512-125.512 34.651 0 66.023 14.042 88.735 36.746v0l22.903 22.967c37.012 1.982 70.012 17.695 94.295 42.091l393.265 393.265 57.386-57.322 137.74 137.676-69.606 69.67 144.074 143.946c18.367 18.324 29.731 43.662 29.731 71.653s-11.363 53.329-29.729 71.651l-0.002 0.002zM268.188 101.443c-9.913-9.927-23.615-16.068-38.752-16.068-8.713 0-16.951 2.035-24.264 5.655l0.32-0.143-54.507-54.444c-6.338-5.969-14.901-9.638-24.321-9.638-19.61 0-35.507 15.897-35.507 35.507 0 9.404 3.656 17.954 9.624 24.307l-0.017-0.019 54.38 54.571c-3.464 6.982-5.491 15.205-5.491 23.902 0 15.158 6.158 28.878 16.11 38.793l393.262 393.262 102.361-102.489-393.196-393.196z" />
-<glyph unicode="&#xe904;" glyph-name="lk_color_fill" d="M877.158 320.614s-70.246-97.28-70.246-137.421c0-40.141 31.539-72.499 70.451-72.499s70.246 32.563 70.246 72.704c-0.205 39.731-70.451 137.216-70.451 137.216zM852.378 423.834l-352.87 364.339c-0.819 0.819-1.638 1.638-2.662 2.458l-105.472 108.954c-12.083 12.288-31.539 12.288-43.418 0-12.083-12.288-12.083-32.563 0-44.851l79.053-81.51-338.534-349.389c-15.974-16.589-15.974-43.213 0-59.802l353.075-364.544c7.987-8.192 18.432-12.288 28.877-12.288s20.89 4.096 28.877 12.288l353.075 364.544c15.974 16.384 15.974 43.213 0 59.802zM587.776 606.925l165.478-170.598h-565.658l282.624 291.84 117.555-121.242z" />
-<glyph unicode="&#xe905;" glyph-name="lk_down" d="M792.832 474.144c-12.512 12.544-32.8 12.48-45.248 0.032l-203.584-203.168v560.992c0 17.664-14.336 32-32 32s-32-14.336-32-32v-563.040l-234.048 235.456c-12.48 12.576-32.704 12.64-45.248 0.128-12.544-12.448-12.608-32.704-0.128-45.248l287.52-289.248c3.168-3.2 6.88-5.536 10.816-7.136 4-1.792 8.384-2.912 13.088-2.912 11.296 0 20.704 6.176 26.4 14.976l254.368 253.952c12.544 12.448 12.544 32.704 0.064 45.216zM864 32h-704c-17.664 0-32 14.304-32 32s14.336 32 32 32h704c17.696 0 32-14.304 32-32s-14.304-32-32-32z" />
-<glyph unicode="&#xe906;" glyph-name="lk_file_template" d="M682.667 960c0.001 0 0.002 0 0.004 0 9.802 0 18.833-3.306 26.037-8.863l-0.099 0.074 4.267-3.712 207.061-207.061c10.127-10.128 16.875-23.634 18.41-38.683l0.022-0.271 0.299-6.315v-332.501c-0.027-23.544-19.119-42.619-42.667-42.619-21.788 0-39.762 16.332-42.347 37.421l-0.021 0.206-0.299 4.992v323.669l-188.373 188.331h-494.293v-853.333h341.333c21.803-0.003 39.784-16.359 42.348-37.47l0.020-0.205 0.299-4.992c-0.003-21.803-16.359-39.784-37.47-42.348l-0.205-0.020-4.992-0.299h-362.667c-33.181 0.002-60.464 25.254-63.68 57.59l-0.021 0.266-0.299 6.144v896c0.002 33.181 25.254 60.464 57.59 63.68l0.266 0.021 6.144 0.299h533.333zM640 960c21.803-0.003 39.784-16.359 42.348-37.47l0.020-0.205 0.299-4.992v-213.333h213.333c21.803-0.003 39.784-16.359 42.348-37.47l0.020-0.205 0.299-4.992c-0.003-21.803-16.359-39.784-37.47-42.348l-0.205-0.020-4.992-0.299h-234.667c-33.181 0.002-60.464 25.254-63.68 57.59l-0.021 0.266-0.299 6.144v234.667c0 23.564 19.103 42.667 42.667 42.667v0zM951.168 264.832c7.716 7.691 18.362 12.446 30.119 12.446 23.564 0 42.667-19.103 42.667-42.667 0-9.874-3.354-18.964-8.985-26.194l0.072 0.096-3.541-4.011-240.896-240.939c-11.583-11.591-27.59-18.761-45.271-18.761-15.375 0-29.483 5.421-40.518 14.456l0.114-0.090-4.864 4.395-112.896 112.939c-7.691 7.716-12.446 18.362-12.446 30.119 0 23.564 19.103 42.667 42.667 42.667 9.874 0 18.964-3.354 26.194-8.985l-0.096 0.072 4.011-3.541 97.835-97.792 225.835 225.792zM341.333 618.667h128q42.667 0 42.667-42.667v0q0-42.667-42.667-42.667h-128q-42.667 0-42.667 42.667v0q0 42.667 42.667 42.667zM341.333 448h341.333q42.667 0 42.667-42.667v0q0-42.667-42.667-42.667h-341.333q-42.667 0-42.667 42.667v0q0 42.667 42.667 42.667zM341.333 277.333h128q42.667 0 42.667-42.667v0q0-42.667-42.667-42.667h-128q-42.667 0-42.667 42.667v0q0 42.667 42.667 42.667z" />
-<glyph unicode="&#xe907;" glyph-name="lk_font_bold" d="M517.292-63.395c6.424-0.385 13.937-0.604 21.5-0.604 90.201 0 173.113 31.206 238.53 83.411l-0.77-0.593c58.416 51.248 95.095 126.048 95.095 209.415 0 4.236-0.095 8.45-0.282 12.64l0.021-0.596c0.069 2.107 0.108 4.584 0.108 7.071 0 61.379-23.975 117.159-63.071 158.485l0.101-0.107c-42.717 43.621-100.156 72.677-164.265 79.117l-1.123 0.091v2.885c54.371 15.469 100.409 45.592 135.035 85.818l0.304 0.361c33.38 38.018 53.745 88.18 53.745 143.098 0 0.991-0.007 1.981-0.020 2.969l0.002-0.15c0.104 2.448 0.164 5.32 0.164 8.206 0 68.946-33.968 129.959-86.082 167.216l-0.623 0.423c-62.586 40.262-139 64.185-221.002 64.185-8.935 0-17.804-0.284-26.598-0.844l1.201 0.061h-348.084v-1022.558h366.114zM436.702 777.969q194.776 0 194.776-111.421c0.045-1.166 0.070-2.534 0.070-3.909 0-37.706-19.227-70.921-48.412-90.376l-0.397-0.249c-34.366-21.421-76.091-34.121-120.782-34.121-4.444 0-8.86 0.126-13.242 0.373l0.608-0.027h-117.551v239.729h104.99zM456.834 357.287c4.131 0.264 8.957 0.414 13.818 0.414 42.434 0 82.195-11.444 116.365-31.414l-1.094 0.591c27.575-17.492 45.613-47.857 45.613-82.435 0-1.19-0.021-2.375-0.064-3.555l0.005 0.171c0.044-1.137 0.069-2.471 0.069-3.811 0-35.923-17.99-67.645-45.453-86.646l-0.35-0.229c-32.469-20.732-72.057-33.044-114.521-33.044-4.322 0-8.614 0.128-12.872 0.379l0.587-0.028h-127.226v239.428h125.183z" />
-<glyph unicode="&#xe908;" glyph-name="lk_font_color" d="M413 322.5c-81.9-4.6-118.8 10.2-110.6 44.4 0 13.7 6.8 35.3 20.5 64.9 13.6 27.3 23.1 47.8 28.6 61.5h245.8c38.2-72.9 58.7-119.5 61.5-140 8.2-25.1-20.5-35.3-86-30.7v-30.7h295v30.7c-57.4-6.8-97 20.5-118.8 81.9l-229.4 491.6h-36.9l-213-481.4c-19.1-66-62.8-96.8-131.1-92.2v-30.7h274.4v30.7zM470.4 759.5l110.6-228.8h-217.1l106.5 228.8zM872.5 194.7h-728c-10.1 0-18.2-8.1-18.2-18.2v-157.8c0-10 8.1-18.2 18.2-18.2h728c10.1 0 18.2 8.2 18.2 18.2v157.8c0 10-8.2 18.2-18.2 18.2z" />
-<glyph unicode="&#xe909;" glyph-name="lk_font_italic" d="M832 864v-64c0-17.673-14.327-32-32-32v0h-125.52l-160-640h93.52c17.673 0 32-14.327 32-32v0-64c0-17.673-14.327-32-32-32v0h-384c-17.673 0-32 14.327-32 32v0 64c0 17.673 14.327 32 32 32v0h125.52l160 640h-93.52c-17.673 0-32 14.327-32 32v0 64c0 17.673 14.327 32 32 32v0h384c17.673 0 32-14.327 32-32v0z" />
-<glyph unicode="&#xe90a;" glyph-name="lk_icon_config" d="M117.333 618.667c0 17.673 14.327 32 32 32v0h426.667c17.673 0 32-14.327 32-32s-14.327-32-32-32v0h-426.667c-17.673 0-32 14.327-32 32v0zM768 554.667c-35.346 0-64 28.654-64 64s28.654 64 64 64v0c35.346 0 64-28.654 64-64s-28.654-64-64-64v0zM768 490.667c70.692 0 128 57.308 128 128s-57.308 128-128 128v0c-70.692 0-128-57.308-128-128s57.308-128 128-128v0zM928 277.333c0 17.673-14.327 32-32 32v0h-426.667c-17.673 0-32-14.327-32-32s14.327-32 32-32v0h426.667c17.673 0 32 14.327 32 32v0zM256 213.333c35.346 0 64 28.654 64 64s-28.654 64-64 64v0c-35.346 0-64-28.654-64-64s28.654-64 64-64v0zM256 149.333c-70.692 0-128 57.308-128 128s57.308 128 128 128v0c70.692 0 128-57.308 128-128s-57.308-128-128-128v0z" />
-<glyph unicode="&#xe90b;" glyph-name="lk_minimap" horiz-adv-x="1102" d="M1038.494 960c35.446 0 64.276-28.751 64.276-64.276v-377.935h-85.622v356.588h-931.525v-824.399h349.184v-85.701h-370.53c-35.498 0-64.276 28.777-64.276 64.276v867.249c0 35.367 28.751 64.197 64.276 64.197zM1043.85 395.225c32.532 0 58.919-26.388 58.919-58.841v-310.508c0-32.54-26.379-58.919-58.919-58.919h-422.912c-32.506 0.045-58.841 26.407-58.841 58.919 0 0 0 0 0 0v0 310.508c0 32.453 26.388 58.841 58.841 58.841zM1017.068 309.602h-369.27v-256.945h369.428v256.945zM252.455 767.409l128.788-128.709 116.972 116.972v-294.439h-294.518l116.815 116.972-128.63 128.551 60.495 60.652z" />
-<glyph unicode="&#xe90c;" glyph-name="lk_open" d="M0 896h404.288l107.072-134.4h512.64v-761.6h-1024v896zM82.432 704.448v-89.792h282.88l106.56-134.976h471.168v90.56h-430.4l-108.416 134.208h-321.792z" />
-<glyph unicode="&#xe90d;" glyph-name="lk_plus_copy" d="M853.333 736h-53.333v53.333c0 40.533-34.133 74.667-74.667 74.667h-554.667c-40.533 0-74.667-34.133-74.667-74.667v-554.667c0-40.533 34.133-74.667 74.667-74.667h53.333v-53.333c0-40.533 34.133-74.667 74.667-74.667h554.667c40.533 0 74.667 34.133 74.667 74.667v554.667c0 40.533-34.133 74.667-74.667 74.667zM160 234.667v554.667c0 6.4 4.267 10.667 10.667 10.667h554.667c6.4 0 10.667-4.267 10.667-10.667v-554.667c0-6.4-4.267-10.667-10.667-10.667h-554.667c-6.4 0-10.667 4.267-10.667 10.667zM864 106.667c0-6.4-4.267-10.667-10.667-10.667h-554.667c-6.4 0-10.667 4.267-10.667 10.667v53.333h437.333c40.533 0 74.667 34.133 74.667 74.667v437.333h53.333c6.4 0 10.667-4.267 10.667-10.667v-554.667zM576 544h-96v96c0 17.067-14.933 32-32 32s-32-14.933-32-32v-96h-96c-17.067 0-32-14.933-32-32s14.933-32 32-32h96v-96c0-17.067 14.933-32 32-32s32 14.933 32 32v96h96c17.067 0 32 14.933 32 32s-14.933 32-32 32z" />
-<glyph unicode="&#xe90e;" glyph-name="lk_recover" d="M604.27 452.14l0.14 335.98 0.070 166.020c0 4.3 5.18 6.47 8.24 3.46l353.94-347.4c5.27-5.18 5.3-13.67 0.050-18.87l-354.27-351.36c-3.060-3.030-8.26-0.87-8.26 3.44l0.090 208.73zM53.94 369.080c8.74 157.92 87.43 274.43 253.54 339.15 87.43 33.66 177.77 46.61 271.030 49.19 13.47 0 21.33 1.67 25.9 5.5l-0.14-298.21c-3.68 2.21-9.17 2.74-17.010 2.74-49.54-2.59-99.090-2.59-148.63-15.54-99.090-23.3-177.77-72.49-206.91-168.28-37.89-126.86 5.83-264.070 148.63-341.74 0-7.77-5.83-5.18-20.4 0-5.83 0-8.74 2.59-11.66 2.59-171.59 60.5-289.71 215.96-294.92 388.2v23.43c0.12 4.32 0.3 8.64 0.57 12.97z" />
-<glyph unicode="&#xe90f;" glyph-name="lk_save" d="M798.293 959.999h-712.959c-47.128 0-85.333-38.205-85.333-85.333v0-853.333c0-47.128 38.205-85.333 85.333-85.333v0h853.333c47.128 0 85.333 38.205 85.333 85.333v0 712.959c0 0.073 0.001 0.16 0.001 0.247 0 11.721-4.726 22.338-12.377 30.049l-183.037 183.037c-7.709 7.648-18.326 12.374-30.047 12.374-0.087 0-0.173 0-0.26-0.001h0.013zM213.333 883.199h597.333v-179.2c0-23.564-19.103-42.667-42.667-42.667v0h-512c-23.564 0-42.667 19.103-42.667 42.667v0zM875.519 12.8h-725.333v409.6c0 23.564 19.103 42.667 42.667 42.667v0h639.999c23.564 0 42.667-19.103 42.667-42.667v0zM633.599 834.133h76.8v-131.84h-76.8z" />
-<glyph unicode="&#xe910;" glyph-name="lk_tips" d="M512-64c-282.77 0-512 229.23-512 512s229.23 512 512 512v0c282.77 0 512-229.23 512-512s-229.23-512-512-512v0zM466.347 207.445c10.198-9.577 23.962-15.461 39.101-15.461 0.474 0 0.946 0.006 1.417 0.017l-0.070-0.001c0.289-0.005 0.631-0.007 0.973-0.007 15.608 0 29.913 5.58 41.028 14.853l-0.102-0.083c10.147 9.37 16.48 22.742 16.48 37.592 0 0.374-0.004 0.747-0.012 1.119l0.001-0.056c0.003 0.215 0.005 0.47 0.005 0.725 0 14.743-6.337 28.005-16.435 37.213l-0.040 0.036c-10.533 9.198-24.407 14.807-39.59 14.807-0.812 0-1.62-0.016-2.424-0.048l0.116 0.004c-0.691 0.030-1.502 0.048-2.317 0.048-14.717 0-28.119-5.627-38.172-14.848l0.042 0.038c-10.524-8.594-17.19-21.57-17.19-36.102 0-0.658 0.014-1.313 0.041-1.964l-0.003 0.093c0-15.872 5.717-28.587 17.152-37.973zM638.464 666.624c-29.44 24.832-68.864 37.291-118.187 37.291-54.869 0-98.56-14.763-130.987-44.288-32.427-29.099-48.555-69.888-48.555-122.368h85.248c0 30.464 6.229 53.675 18.688 69.632 14.933 18.773 38.4 28.16 70.315 28.16 25.941 0 45.909-6.571 59.904-19.712 12.972-13.427 20.965-31.736 20.965-51.912 0-1.040-0.021-2.075-0.063-3.105l0.005 0.148c-0.309-19.363-7.95-36.883-20.259-49.958l0.035 0.038-8.96-9.813c-48.896-40.789-78.080-70.571-87.552-89.344-9.984-18.261-14.933-41.216-14.933-68.864v-9.899h86.016v9.899c0 16.811 3.755 32.341 11.264 46.336 7.424 13.653 17.408 25.088 29.952 34.475 34.901 28.587 56.32 47.104 64.256 55.552 18.517 22.955 27.733 51.797 27.733 86.528 0 43.093-14.933 76.885-44.885 101.205z" />
-<glyph unicode="&#xe911;" glyph-name="lk_to_center" d="M213.333 320h-85.333v-170.667c0-46.933 38.4-85.333 85.333-85.333h170.667v85.333h-170.667v170.667zM213.333 746.667h170.667v85.333h-170.667c-46.933 0-85.333-38.4-85.333-85.333v-170.667h85.333v170.667zM810.667 832h-170.667v-85.333h170.667v-170.667h85.333v170.667c0 46.933-38.4 85.333-85.333 85.333zM810.667 149.333h-170.667v-85.333h170.667c46.933 0 85.333 38.4 85.333 85.333v170.667h-85.333v-170.667zM512 576c-70.827 0-128-57.173-128-128s57.173-128 128-128 128 57.173 128 128-57.173 128-128 128z" />
-<glyph unicode="&#xe912;" glyph-name="lk_undo" d="M761.856-64c113.728 206.048 132.896 520.32-313.856 509.824v-253.824l-384 384 384 384v-248.384c534.976 13.952 594.56-472.224 313.856-775.616z" />
-<glyph unicode="&#xe913;" glyph-name="lk_zoom_in" d="M637 517h-118v134c0 4.4-3.6 8-8 8h-60c-4.4 0-8-3.6-8-8v-134h-118c-4.4 0-8-3.6-8-8v-60c0-4.4 3.6-8 8-8h118v-134c0-4.4 3.6-8 8-8h60c4.4 0 8 3.6 8 8v134h118c4.4 0 8 3.6 8 8v60c0 4.4-3.6 8-8 8zM921 93l-146 146c122.1 148.9 113.6 369.5-26 509-148 148.1-388.4 148.1-537 0-148.1-148.6-148.1-389 0-537 139.5-139.6 360.1-148.1 509-26l146-146c3.2-2.8 8.3-2.8 11 0l43 43c2.8 2.7 2.8 7.8 0 11zM696 264c-118.8-118.7-311.2-118.7-430 0-118.7 118.8-118.7 311.2 0 430 118.8 118.7 311.2 118.7 430 0 118.7-118.8 118.7-311.2 0-430z" />
-<glyph unicode="&#xe914;" glyph-name="lk_zoom_out" d="M637 517h-312c-4.4 0-8-3.6-8-8v-60c0-4.4 3.6-8 8-8h312c4.4 0 8 3.6 8 8v60c0 4.4-3.6 8-8 8zM921 93l-146 146c122.1 148.9 113.6 369.5-26 509-148 148.1-388.4 148.1-537 0-148.1-148.6-148.1-389 0-537 139.5-139.6 360.1-148.1 509-26l146-146c3.2-2.8 8.3-2.8 11 0l43 43c2.8 2.7 2.8 7.8 0 11zM696 264c-118.8-118.7-311.2-118.7-430 0-118.7 118.8-118.7 311.2 0 430 118.8 118.7 311.2 118.7 430 0 118.7-118.8 118.7-311.2 0-430z" />
-<glyph unicode="&#xe915;" glyph-name="lk_success" d="M512 885.333c-241.067 0-437.333-196.267-437.333-437.333s196.267-437.333 437.333-437.333 437.333 196.267 437.333 437.333-196.267 437.333-437.333 437.333zM512 74.667c-204.8 0-373.333 168.533-373.333 373.333s168.533 373.333 373.333 373.333 373.333-168.533 373.333-373.333-168.533-373.333-373.333-373.333zM701.867 578.133l-253.867-256-125.867 125.867c-12.8 12.8-32 12.8-44.8 0s-12.8-32 0-44.8l149.333-149.333c6.4-6.4 14.933-8.533 23.467-8.533s17.067 2.133 23.467 8.533l277.333 277.333c12.8 12.8 12.8 32 0 44.8-14.933 12.8-36.267 12.8-49.067 2.133z" />
-<glyph unicode="&#xe916;" glyph-name="lk_failed" d="M924.78 623.2c-69.897 162.92-228.929 274.96-414.13 274.96-248.169 0-449.35-201.181-449.35-449.35s201.181-449.35 449.35-449.35c248.169 0 449.35 201.181 449.35 449.35v0c0 0.187 0 0.408 0 0.628 0 62.754-12.953 122.482-36.332 176.657l1.112-2.895zM875.050 295.45c-61.511-143.353-201.448-241.935-364.41-241.935-218.379 0-395.41 177.031-395.41 395.41s177.031 395.41 395.41 395.41c218.379 0 395.41-177.031 395.41-395.41 0-0.040 0-0.081 0-0.121v0.006c0-0.128 0-0.28 0-0.431 0-55.23-11.401-107.798-31.979-155.477l0.979 2.548zM671.090 607.090c-4.886 4.885-11.635 7.906-19.090 7.906s-14.204-3.021-19.090-7.906l-120.91-120.91-120.91 120.91c-4.858 4.727-11.499 7.642-18.822 7.642-14.912 0-27-12.088-27-27 0-7.323 2.915-13.964 7.648-18.828l120.904-120.904-120.91-120.91c-5.047-4.911-8.178-11.769-8.178-19.358 0-14.912 12.088-27 27-27 7.589 0 14.447 3.131 19.352 8.172l120.916 120.916 120.91-120.91c4.858-4.727 11.499-7.642 18.822-7.642 14.912 0 27 12.088 27 27 0 7.323-2.915 13.964-7.648 18.828l-120.904 120.904 120.91 120.91c4.885 4.886 7.906 11.635 7.906 19.090s-3.021 14.204-7.906 19.090v0z" />
-<glyph unicode="&#xe917;" glyph-name="lk_running" d="M166.671 455.831c2.086 92.486 40.292 175.66 101.011 236.299l0.004 0.004c62.232 62.512 148.354 101.196 243.511 101.196 0.261 0 0.522 0 0.783-0.001h-0.041c0.253 0.001 0.553 0.001 0.852 0.001 95.047 0 181.058-38.689 243.143-101.178l0.018-0.018c9.939-9.939 19.275-20.48 27.889-31.503l-60.416-47.164c-1.912-1.491-3.13-3.794-3.13-6.382 0-0.598 0.065-1.181 0.189-1.743l-0.010 0.053c0.674-3.011 2.973-5.351 5.908-6.072l0.055-0.011 176.369-43.189c0.561-0.139 1.206-0.219 1.869-0.219 4.408 0 7.99 3.533 8.070 7.922v0.007l0.843 181.609c0 0.005 0 0.011 0 0.017 0 4.425-3.587 8.011-8.011 8.011-1.871 0-3.593-0.642-4.956-1.717l0.017 0.013-56.621-44.273c-77.878 98.981-197.664 161.961-332.159 161.961-229.909 0-416.835-184.035-421.498-412.828l-0.007-0.435c-0.001-0.054-0.002-0.117-0.002-0.181 0-4.425 3.587-8.011 8.011-8.011 0.001 0 0.001 0 0.002 0h60.235c0.019 0 0.040 0 0.062 0 4.361 0 7.908 3.485 8.009 7.821v0.009zM925.636 448h-60.235c-0.019 0-0.040 0-0.062 0-4.361 0-7.908-3.485-8.009-7.821v-0.009c-1.945-92.511-40.185-175.728-101.003-236.291l-0.012-0.012c-62.259-62.513-148.405-101.196-243.586-101.196-0.214 0-0.427 0-0.641 0.001h0.033c-0.238-0.001-0.52-0.001-0.802-0.001-109.934 0-207.811 51.622-270.713 131.947l-0.567 0.752 60.416 47.164c1.919 1.479 3.143 3.778 3.143 6.362 0 3.766-2.598 6.924-6.1 7.782l-0.055 0.011-176.369 43.189c-0.561 0.139-1.206 0.219-1.869 0.219-4.408 0-7.99-3.533-8.070-7.922v-0.007l-0.723-181.73c0-6.746 7.77-10.541 12.951-6.325l56.621 44.273c77.865-99.043 197.68-162.070 332.215-162.070 229.957 0 416.905 184.138 421.442 413.008l0.007 0.424c0.003 0.086 0.005 0.187 0.005 0.289 0 3.307-2.019 6.143-4.892 7.341l-0.053 0.019c-0.901 0.381-1.949 0.602-3.048 0.602-0.009 0-0.017 0-0.026 0h0.001z" />
-<glyph unicode="&#xe918;" glyph-name="lk_step_flow" d="M562.176 548.864c0-13.824 11.264-25.088 25.088-25.088s25.088 11.264 25.088 25.088-11.264 25.088-25.088 25.088-25.088-11.264-25.088-25.088zM335.872 724.48c-13.824 0-25.088-11.264-25.088-25.088s11.264-25.088 25.088-25.088 25.088 11.264 25.088 25.088c0.512 13.824-10.752 25.088-25.088 25.088zM436.224 372.224c13.824 0 25.6 11.264 25.6 25.088s-11.264 25.6-25.088 25.6-25.6-11.264-25.6-25.088 11.264-25.088 25.088-25.6zM839.168 877.056h-654.336c-41.472 0-75.264-33.792-75.776-75.264v-707.584c0-41.472 33.792-75.264 75.776-75.264h527.872v176.128c0 13.824 11.264 25.088 25.088 25.088h176.128v581.632c0 41.472-33.28 75.264-74.752 75.264zM486.912 119.296h-201.216c-13.824 0-25.088 11.264-25.088 25.088s11.264 25.088 25.088 25.088h201.216c13.824 0 25.088-11.264 25.088-25.088s-11.264-25.088-25.088-25.088zM260.608 245.248c0 13.824 11.264 25.088 25.088 25.088h100.864c13.824-1.024 24.064-13.312 23.040-27.136-1.024-12.288-10.752-22.016-23.040-23.040h-100.864c-13.824-0.512-25.088 10.752-25.088 25.088zM360.96 422.912h4.608c13.824 38.912 56.32 59.904 95.744 46.080 21.504-7.68 38.4-24.576 46.080-46.080h169.984l-7.168 7.168c-9.728 9.728-9.728 25.6 0 35.84 9.728 9.728 25.6 9.728 35.84 0l50.176-49.664c9.728-9.728 9.728-25.6 0-35.84l-50.176-50.688c-9.728-9.728-25.6-9.728-35.84 0s-9.728 25.6 0 35.84l7.168 7.168h-169.984c-13.824-38.912-56.32-59.904-95.744-46.080-21.504 7.68-38.4 24.576-46.080 46.080h-4.608c-55.808 0-100.864 45.056-100.864 100.864s45.056 100.864 100.864 100.864h155.648c13.312 38.912 56.32 59.904 95.232 46.592 22.016-7.68 38.912-24.576 46.592-46.592h4.608c27.648-1.536 51.712 19.456 53.248 47.616 1.536 27.648-19.456 51.712-47.616 53.248h-261.632c-13.824-39.424-56.832-59.904-96.256-46.080s-59.904 56.832-46.080 96.256c13.824 39.424 56.832 59.904 96.256 46.080 21.504-7.68 38.4-24.576 46.080-46.080h256c55.296 2.048 102.4-40.96 104.448-96.768 2.048-55.296-40.96-102.4-96.768-104.448h-12.8c-13.312-38.912-56.32-59.904-95.232-46.592-22.016 7.68-38.912 24.576-46.592 46.592h-155.648c-27.648 1.536-51.712-19.456-53.248-47.616-1.536-27.648 19.456-51.712 47.616-53.248 2.56-0.512 4.608-0.512 6.144-0.512zM763.392 33.28l136.192 136.192h-136.192v-136.192z" />
-<glyph unicode="&#xe919;" glyph-name="lk_data_output" d="M379.611 694.126c16.238-16.311 43.081-16.311 59.392 0l31.451 31.451v-190.757c0-23.113 18.944-42.057 42.057-42.057 23.179 0.083 41.943 18.872 41.984 42.053v190.907l31.451-31.525c16.311-16.311 43.154-16.311 59.465 0 7.55 7.622 12.215 18.114 12.215 29.696s-4.665 22.074-12.219 29.699l-103.202 103.128c-7.622 7.55-18.114 12.215-29.696 12.215s-22.074-4.665-29.699-12.219l-103.202-103.202c-7.603-7.599-12.306-18.098-12.306-29.696s4.703-22.098 12.305-29.696v0zM897.17 810.057h-240.274l48.64-48.64h184.832v-477.038h-755.931v477.038h183.954l48.64 48.567h-239.177c-26.925-0.083-48.735-21.867-48.859-48.774v-541.489c0-26.843 21.943-48.859 48.786-48.859h256.805v-72.85l-55.003-55.003s-5.998-11.995 8.997-11.995h347.794c14.994 0 8.997 11.995 8.997 11.995l-55.003 55.003v72.85h256.805c26.951 0.083 48.777 21.909 48.859 48.851v541.485c-0.124 26.919-21.934 48.704-48.851 48.786h-0.008z" />
-<glyph unicode="&#xe91a;" glyph-name="lk_data_input" d="M379.6 667.7c-16.3-16.3-16.3-43.1 0-59.4l103.2-103.2c16.3-16.3 43.1-16.3 59.4 0l103.2 103.2c16.3 16.3 16.3 43.1 0 59.4s-43.1 16.3-59.4 0l-31.5-31.5v190.8c0 23.1-18.9 42-42 42s-42-18.9-42-42v-190.8l-31.5 31.5c-16.4 16.3-43.1 16.3-59.4 0zM897.2 810h-293.2v-48.6h286.5v-477h-756v477h286.5v48.6h-293.2c-26.8 0-48.8-22-48.8-48.8v-541.5c0-26.8 22-48.8 48.8-48.8h256.8v-72.9l-55-55s-6-12 9-12h347.8c15 0 9 12 9 12l-55 55v72.9h256.8c26.8 0 48.8 22 48.8 48.8v541.5c0 26.8-22 48.8-48.8 48.8z" />
-<glyph unicode="&#xe91b;" glyph-name="lk_start" d="M924.059 493.195c-1.883 38.202-23.717 72.597-57.491 90.555l-607.086 325.411c-33.877 18.193-74.843 17.13-107.73-2.797-33.222-19.646-53.366-55.597-52.778-94.19l4.364-729.352c-0.059-40.136 22.209-76.97 57.772-95.579 14.543-8.045 31.886-12.78 50.334-12.78 0.198 0 0.396 0.001 0.594 0.002h-0.030c22.852 0.093 44.045 7.12 61.604 19.084l-0.382-0.246 602.849 404.131c31.703 21.278 49.913 57.631 47.979 95.763zM177.079 33.548l1.346 832.289 692.623-371.223-693.969-461.066z" />
-<glyph unicode="&#xe91c;" glyph-name="lk_warning_tips" d="M460.8 294.4h102.4v-102.4h-102.4v102.4zM460.8 704h102.4v-307.2h-102.4v307.2zM511.488 960c-282.624 0-511.488-229.376-511.488-512s228.864-512 511.488-512c283.136 0 512.512 229.376 512.512 512s-229.376 512-512.512 512zM512 38.4c-226.304 0-409.6 183.296-409.6 409.6s183.296 409.6 409.6 409.6 409.6-183.296 409.6-409.6-183.296-409.6-409.6-409.6z" />
-<glyph unicode="&#xe91d;" glyph-name="lk_text" d="M724.038 661.145h-424.077c-4.962 0-8.987-4.026-8.987-8.987v-141.376c0-2.434 0.986-4.763 2.732-6.458 1.746-1.689 4.109-2.56 6.54-2.526l18.751 0.59c4.423 0.143 8.081 3.479 8.634 7.871 5.911 47.374 45.467 80.044 65.949 85.028 6.049 1.48 14.476 2.224 25.053 2.224 12.941 0 26.145-1.147 34.21-2.004-0.091-50.063-0.581-317.876-0.581-336.347 0-11.676-16.415-18.719-20.795-20.388l-36.029-0.57c-4.828-0.082-8.732-3.953-8.845-8.78l-0.59-25.817c-0.056-2.418 0.867-4.758 2.555-6.484 1.691-1.737 4.010-2.712 6.428-2.712h234.059c4.962 0 8.988 4.028 8.988 8.988v25.187c0 4.963-4.027 8.988-8.988 8.988h-42.369c-10.383 1.199-19.057 13.291-22.532 19.6l0.513 341.292c4.22 0.375 10.123 0.737 17.359 0.737 14.281 0 28.964-1.346 43.645-3.996 30.609-5.527 61.849-66.544 71.302-89.584 1.385-3.376 4.669-5.583 8.321-5.583h18.751c4.962 0 8.987 4.027 8.987 8.989v143.128c0.004 4.966-4.023 8.991-8.984 8.991v0zM847.029 894.71h-670.063c-61.677 0-111.675-50.004-111.675-111.675v-687.47c8.415-53.352 55.962-94.274 111.675-94.274h670.068c61.676 0 111.675 50.004 111.675 111.676v670.068c-0.001 61.668-50 111.675-111.681 111.675v0zM847.033 168.806c0-30.843-24.998-55.84-55.84-55.84l-558.387 0.004c-30.838 0-55.84 24.999-55.84 55.84v0 558.383c0 30.838 24.998 55.841 55.84 55.841h558.387c30.838 0 55.84-24.998 55.84-55.841v0-558.387z" />
-<glyph unicode="&#xe91e;" glyph-name="lk_line" horiz-adv-x="1025" d="M1024.003 876.851l-940.851-940.851-83.149 83.149 940.851 940.851 83.149-83.149z" />
-<glyph unicode="&#xe91f;" glyph-name="lk_border_angle" d="M340.821 960c-188.192-0.097-340.724-152.63-340.821-340.812v-683.188h341.504v682.667h682.496v341.333h-683.179z" />
-<glyph unicode="&#xe920;" glyph-name="lk_layer_set" d="M938.633 389.784l-383.961-172.585c-36.762-15.99-51.4-15.99-85.33 0l-383.976 172.585c-20.383 10.827-25.879 50.887-25.879 72.746 25.631-14.637 61.674-30.959 60.335-30.131l392.179-180.788 392.192 180.788c0.662 0.166 35.629 17.786 60.32 30.131 0-22.369-6.933-63.908-25.879-72.746zM938.633 570.587l-383.961-172.599c-36.762-15.991-51.4-15.991-85.33 0l-383.976 172.599c-30.16 16.005-29.222 66.407 0 85.229l383.976 202.73c33.93 16.944 55.155 17.882 85.33 0l383.961-202.73c29.221-16.005 28.255-72.042 0-85.229zM511.999 824.135l-392.179-210.933 392.179-165.253 392.193 165.253-392.193 210.933zM511.999 70.797l392.192 180.815c0.662 0.166 35.629 17.786 60.32 30.13 0-22.369-6.932-63.908-25.879-72.746l-383.96-172.612c-36.762-15.99-51.4-15.99-85.33 0l-383.976 172.613c-20.383 10.827-25.879 50.873-25.879 72.746 25.631-14.637 61.674-30.959 60.335-30.13l392.178-180.816z" />
-<glyph unicode="&#xe921;" glyph-name="lk_shape_set" d="M458.5 782.7v-273h-288.2v273h288.2zM499.5 823.7h-370.3v-355h370.2v355h0.1zM305.7 338.5l137.1-237.4h-274.1l137 237.4zM305.7 420.5l-208-360.5h416.2l-208.2 360.5zM732.7 743.2l23.1-46.8 9.5-19.3 73-10.6-37.3-36.4-15.4-15.1 3.6-21.2 8.8-51.4-65.3 34.3-19.1-10-46.2-24.3 8.8 51.4 3.6 21.3-15.4 15.1-37.3 36.4 72.8 10.6 9.5 19.3 23.3 46.7zM732.7 835.9l-59.9-121.3-133.8-19.4 96.8-94.4-22.8-133.3 119.7 62.9 119.7-62.9-22.9 133.3 96.8 94.4-133.8 19.4-59.8 121.3zM732.7 364.2c72.5 0 131.5-59 131.5-131.5s-59-131.5-131.5-131.5-131.6 59-131.6 131.5 59 131.5 131.6 131.5zM732.7 405.2c-95.3 0-172.6-77.2-172.6-172.5s77.3-172.6 172.6-172.6 172.5 77.2 172.5 172.6c0 95.3-77.3 172.5-172.5 172.5z" />
-<glyph unicode="&#xe922;" glyph-name="lk_align_right" d="M928 960c17.673 0 32-14.327 32-32v0-960c0-17.673-14.327-32-32-32s-32 14.327-32 32v0 960c0 17.673 14.327 32 32 32v0zM352 768h448c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-448c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0zM96 384h704c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-704c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0z" />
-<glyph unicode="&#xe923;" glyph-name="lk_align_center" d="M477.312 384v128h-210.624c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0h210.624v157.312c0 19.158 15.53 34.688 34.688 34.688s34.688-15.53 34.688-34.688v0-157.312h210.624c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-210.624v-128h349.312c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-349.312v-157.312c0-19.158-15.53-34.688-34.688-34.688s-34.688 15.53-34.688 34.688v157.312h-349.312c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0h349.312z" />
-<glyph unicode="&#xe924;" glyph-name="lk_align_left" d="M96 960c17.673 0 32-14.327 32-32v0-960c0-17.673-14.327-32-32-32s-32 14.327-32 32v0 960c0 17.673 14.327 32 32 32v0zM224 768h448c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-448c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0zM224 384h704c17.673 0 32-14.327 32-32v0-192c0-17.673-14.327-32-32-32v0h-704c-17.673 0-32 14.327-32 32v0 192c0 17.673 14.327 32 32 32v0z" />
-<glyph unicode="&#xe925;" glyph-name="lk_align_h_center" d="M960 480v-64h-896v64h896zM832 704v-512h-256v512h256zM448 832v-768h-256v768h256z" />
-<glyph unicode="&#xe926;" glyph-name="lk_align_bottom" horiz-adv-x="1170" d="M1170.286-27.429c0 20.198-16.374 36.571-36.571 36.571h-1097.143c-20.195-0.003-36.565-16.376-36.565-36.571s16.37-36.568 36.565-36.571h1097.143c20.198 0 36.571 16.374 36.571 36.571v0zM950.857 118.857v512c0 20.198-16.374 36.571-36.571 36.571v0h-219.429c-20.198 0-36.571-16.374-36.571-36.571v0-512c0-20.198 16.374-36.571 36.571-36.571h219.429c20.198 0 36.571 16.374 36.571 36.571v0zM512 118.857v804.571c0 20.198-16.374 36.571-36.571 36.571v0h-219.429c-20.198 0-36.571-16.374-36.571-36.571v0-804.571c0-20.198 16.374-36.571 36.571-36.571v0h219.429c20.198 0 36.571 16.374 36.571 36.571v0z" />
-<glyph unicode="&#xe927;" glyph-name="lk_align_top" horiz-adv-x="1170" d="M1170.286 923.429c0-20.198-16.374-36.571-36.571-36.571h-1097.143c-20.195 0.003-36.565 16.376-36.565 36.571s16.37 36.568 36.565 36.571h1097.143c20.198 0 36.571-16.374 36.571-36.571v0zM950.857 777.143v-512c0-20.198-16.374-36.571-36.571-36.571v0h-219.429c-20.198 0-36.571 16.374-36.571 36.571v0 512c0 20.198 16.374 36.571 36.571 36.571v0h219.429c20.198 0 36.571-16.374 36.571-36.571v0zM512 777.143v-804.571c0-20.198-16.374-36.571-36.571-36.571v0h-219.429c-20.198 0-36.571 16.374-36.571 36.571v0 804.571c0 20.198 16.374 36.571 36.571 36.571v0h219.429c20.198 0 36.571-16.374 36.571-36.571v0z" />
-<glyph unicode="&#xe928;" glyph-name="lk_align_icon" d="M128 64h768v-64h-768zM128 192h768v-64h-768zM128 320h768v-64h-768zM128 448h768v-64h-768zM0 896h64v-896h-64zM960 896h64v-896h-64zM440.2 512l-128 128h399.6l-128-128h184.2l192 192-192 192h-184.2l128-128h-399.6l128 128h-184.2l-192-192 192-192z" />
-<glyph unicode="&#xe929;" glyph-name="lk_font_size" d="M809.664 524.8v0.192h-72.32v-0.192l-64.448-177.024 36.16-99.392 64.448 176.96 72.192-198.4h-128.832l23.68-64.96h128.832l44.608-122.432c2.292-6.209 8.158-10.557 15.040-10.56h49.728c4.408 0.014 7.976 3.59 7.976 8 0 0.988-0.179 1.934-0.506 2.807l0.018-0.055-176.576 485.056zM427.776 884.224h-87.552c-0.008 0-0.017 0-0.026 0-1.163 0-2.154-0.739-2.528-1.773l-0.006-0.019-309.184-849.792c-0.112-0.285-0.177-0.615-0.177-0.96 0-1.485 1.203-2.688 2.688-2.688 0.017 0 0.035 0 0.052 0h74.301c6.857 0.031 12.692 4.371 14.94 10.449l0.036 0.111 79.36 217.984h368.64l79.36-217.984c2.292-6.209 8.158-10.557 15.040-10.56h74.304c0.015 0 0.032 0 0.049 0 1.485 0 2.688 1.203 2.688 2.688 0 0.345-0.065 0.675-0.184 0.979l0.006-0.018-309.312 849.792c-0.38 1.053-1.371 1.792-2.534 1.792-0.009 0-0.018 0-0.027 0h0.001zM228.736 337.472l155.264 426.56 155.2-426.56h-310.4z" />
-<glyph unicode="&#xe92a;" glyph-name="lk_shape_stroke" horiz-adv-x="1066" d="M554.667 576c0.002 0 0.004 0 0.007 0 23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667c-0.002 0-0.005 0-0.007 0v0c-23.561-0.004-42.66-19.105-42.66-42.667s19.099-42.663 42.66-42.667v0zM554.667 405.333c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0zM725.333 405.333c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0zM554.667 234.667c0.002 0 0.004 0 0.007 0 23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667c-0.002 0-0.005 0-0.007 0v0c-23.561-0.004-42.66-19.105-42.66-42.667s19.099-42.663 42.66-42.667v0zM896 832h-682.667c-23.564 0-42.667-19.103-42.667-42.667v-682.667c0-23.564 19.103-42.667 42.667-42.667h682.667c23.564 0 42.667 19.103 42.667 42.667v0 682.667c0 23.564-19.103 42.667-42.667 42.667v0zM853.333 149.333h-597.333v597.333h597.333v-597.333zM384 405.333c23.564 0 42.667 19.103 42.667 42.667s-19.103 42.667-42.667 42.667v0c-23.564 0-42.667-19.103-42.667-42.667s19.103-42.667 42.667-42.667v0z" />
-<glyph unicode="&#xe92b;" glyph-name="lk_angular" d="M858.496 279.68v335.808c58.7 18.539 100.528 72.47 100.608 136.183v0.009c-0.073 78.687-63.841 142.455-142.521 142.528h-0.007c-64.448 0-119.040-43.008-136.576-101.888h-335.808c-18.205 59.311-72.415 101.717-136.556 101.888h-0.020c-78.687-0.073-142.455-63.841-142.528-142.521v-0.007c0.094-64.368 42.785-118.74 101.389-136.442l1.011-0.262v-334.72c-59.555-18.038-102.17-72.421-102.208-136.764v-0.004c0-78.592 63.936-142.464 142.528-142.464 63.872 0 118.080 42.176 136.064 100.288h336.896c18.643-58.546 72.51-100.224 136.12-100.288h0.008c78.664 0.073 142.419 63.805 142.528 142.454v0.010c-0.212 63.771-42.142 117.692-99.915 135.916l-1.013 0.276zM816.576 834.176c45.504 0 82.56-36.992 82.56-82.496-1.795-44.176-38.042-79.31-82.496-79.31s-80.701 35.133-82.491 79.148l-0.005 0.162c0 45.504 37.056 82.56 82.432 82.56zM125.12 751.68c0 45.504 36.992 82.56 82.496 82.56 44.176-1.795 79.31-38.042 79.31-82.496s-35.133-80.701-79.148-82.491l-0.162-0.005c0 0 0 0 0 0-45.552 0-82.487 36.89-82.56 82.425v0.007zM207.808 60.992c-45.597 0-82.56 36.963-82.56 82.56v0c1.795 44.176 38.042 79.31 82.496 79.31s80.701-35.133 82.491-79.148l0.005-0.162c0-45.568-37.056-82.56-82.432-82.56zM675.392 161.28h-326.272c-8.383 63.923-58.022 114.106-120.959 123.236l-0.769 0.092v325.952c63.034 9.254 112.227 58.577 121.19 120.898l0.090 0.766h326.72c9.109-63.695 59.165-113.382 122.276-121.84l0.732-0.080v-325.568c-64-8.32-114.88-59.328-123.008-123.52zM816.832 60.992c-45.597 0-82.56 36.963-82.56 82.56v0c1.795 44.176 38.042 79.31 82.496 79.31s80.701-35.133 82.491-79.148l0.005-0.162c0-45.568-36.992-82.56-82.496-82.56z" />
-<glyph unicode="&#xe92c;" glyph-name="lk_triangle" d="M213.333 106.667c-17.067 0-29.867 4.267-42.667 8.533-29.867 12.8-55.467 38.4-68.267 68.267s-12.8 68.267 0 98.133c0 0 0 4.267 4.267 4.267l298.667 524.8c12.8 21.333 29.867 38.4 51.2 51.2 59.733 34.133 140.8 12.8 174.933-51.2l298.667-520.533s0-4.267 4.267-4.267c4.267-12.8 8.533-25.6 8.533-42.667 0-34.133-8.533-68.267-34.133-93.867-21.333-25.6-55.467-38.4-89.6-42.667h-605.867zM179.2 247.467c-4.267-8.533-4.267-21.333 0-29.867s12.8-17.067 21.333-21.333c4.267-4.267 8.533-4.267 12.8-4.267h597.333c8.533 0 21.333 4.267 25.6 12.8s12.8 21.333 12.8 29.867c0 4.267 0 8.533-4.267 12.8l-298.667 520.533c-8.533 21.333-34.133 29.867-55.467 17.067-8.533-4.267-12.8-8.533-17.067-17.067l-294.4-520.533z" />
-<glyph unicode="&#xe92d;" glyph-name="lk_color_palette" d="M954.757 668.527c-3.61 3.685-8.041 5.583-13.168 5.641-12.515 0.141-26.509-10.942-36.036-20.255l-340.912-331.177c-12.501-12.229-58.516-86.966-60.468-90.143l-7.452-12.121 12.135 7.428c3.217 1.968 78.963 48.374 91.438 60.569l340.911 331.178c15.151 14.815 26.671 35.436 13.552 48.879v0zM741.987 565.522c0-27.609-22.407-50.015-50.015-50.015-27.613 0-50.021 22.406-50.021 50.015 0 27.61 22.408 50.018 50.021 50.018 27.608 0 50.015-22.408 50.015-50.018v0zM216.812 390.469c-27.61 0-50.016 22.403-50.016 50.012 0 27.612 22.406 50.020 50.016 50.020 27.608 0 50.017-22.408 50.017-50.020 0-27.609-22.409-50.012-50.017-50.012v0zM291.838 565.522c0 27.61 22.408 50.018 50.015 50.018 27.61 0 50.018-22.408 50.018-50.018 0-27.609-22.407-50.015-50.018-50.015-27.609 0-50.015 22.382-50.015 50.015v0zM466.896 615.54c0 27.609 22.406 50.015 50.015 50.015 27.612 0 50.019-22.406 50.019-50.015s-22.408-50.018-50.019-50.018c-27.609 0-50.015 22.385-50.015 50.018v0zM853.74 445.916c-22.989-148.967-158.732-299.942-351.947-299.942-36.782 0-75.999 7.275-107.598 19.959-33.607 13.49-48.851 29.354-51.907 39.693-1.594 5.398-3.092 11.296-4.68 17.542-4.65 18.302-9.922 39.045-20.252 56.259-18.376 30.618-44.815 37.045-63.76 37.045-7.166 0-14.798-0.914-22.675-2.712-12.865-2.936-25.363-4.424-37.141-4.424-25.123 0-67.464 6.665-68.765 51.308-6.59 227.942 180.734 351.748 369.298 373.326 13.337 1.525 27.603 2.296 42.403 2.296 53.124 0 111.543-10.001 152.463-26.099 9.248-3.638 14.375-6.016 39.204-18.184 25.653-12.57 46.348-30.432 62.898-47.642l30.158 53.075c-18.027 17.013-40.334 34.407-67.102 47.525-24.89 12.197-31.893 15.514-43.565 20.106-47.339 18.623-114.033 30.194-174.053 30.194-17.027 0-33.545-0.901-49.102-2.678-115.514-13.22-220.687-59.057-296.143-129.075-85.507-79.342-128.872-184.654-125.405-304.555 1.005-34.47 15.117-63.017 40.81-82.556 22.381-17.020 52.431-26.014 86.903-26.014 16.187 0 33.097 1.985 50.268 5.903 3.582 0.818 6.794 1.232 9.548 1.232 11.469 0 16.99-10.044 26.853-48.854 1.654-6.509 3.365-13.241 5.281-19.73 9.434-31.912 39.343-58.784 86.495-77.711 38.319-15.382 85.544-24.203 129.567-24.203 54.104 0 106.474 10.135 155.659 30.123 46.241 18.793 88.502 45.763 125.607 80.165 35.744 33.141 65.271 71.791 87.757 114.884 22.526 43.163 36.888 88.666 42.691 135.269 0.262 2.117 0.509 4.321 0.732 6.548l0.148 1.469v0.057c0.222 2.336 0.404 4.695 0.571 7.065l-61.218-16.661z" />
-<glyph unicode="&#xe92e;" glyph-name="lk_five_pointed" d="M231.867 35.44l99.624 315.316-254.598 217.71h320.431l114.726 293.374 128.642-293.375h306.415l-240.135-217.562 102.703-316.754-296.032 198.443-281.776-197.151zM513.135 272.173l238.918-159.045-81.227 247.13 196.016 176.485h-246.748l-106.382 242.59-94.867-242.59h-258.161l206.984-175.878-78.212-249.077 223.679 160.385z" />
-<glyph unicode="&#xe92f;" glyph-name="lk_ellipse" d="M512 192c233.92 0 416 121.408 416 256s-182.080 256-416 256-416-121.408-416-256c0-134.592 182.080-256 416-256zM512 128c-265.088 0-480 143.296-480 320s214.912 320 480 320c265.088 0 480-143.296 480-320s-214.912-320-480-320z" />
-<glyph unicode="&#xe930;" glyph-name="lk_circle" d="M512-21.312c-259.12 0.182-469.129 210.191-469.312 469.294v0.018c0.182 259.12 210.191 469.129 469.294 469.312h0.018c259.12-0.182 469.129-210.191 469.312-469.294v-0.018c-0.182-259.12-210.191-469.129-469.294-469.312h-0.018zM512 823.168c-1.457 0.020-3.177 0.032-4.9 0.032-207.2 0-375.168-167.968-375.168-375.168s167.968-375.168 375.168-375.168c1.723 0 3.443 0.012 5.161 0.035l-0.261-0.003c205.081 2.764 370.268 169.659 370.268 375.136s-165.187 372.372-370.007 375.133l-0.261 0.003z" />
-<glyph unicode="&#xe931;" glyph-name="lk_rect" d="M128 106.667h768c23.564 0 42.667 19.103 42.667 42.667v0 597.333c0 23.564-19.103 42.667-42.667 42.667v0h-768c-23.564 0-42.667-19.103-42.667-42.667v0-597.333c0-23.564 19.103-42.667 42.667-42.667v0zM170.667 704h682.667v-512h-682.667v512z" />
-<glyph unicode="&#xe932;" glyph-name="lk_right_triangle" d="M870.4 806.4l-691.2-691.2v691.2h691.2zM746.829 755.2h-516.429v-516.403l516.403 516.403z" />
-<glyph unicode="&#xe933;" glyph-name="lk_set_size" d="M874.24 355.502c22.292 2.14 42.977 11.735 59.238 27.566v-282.501c0-48.855-39.762-88.596-88.627-88.596h-634.982c-48.876 0-88.637 39.741-88.637 88.596v634.307c0 48.855 39.762 88.607 88.637 88.607h283.269c-15.247-15.647-25.385-36.291-27.607-59.228h-255.672c-16.21 0-29.399-13.179-29.399-29.379v-634.296c0-16.189 13.189-29.368 29.399-29.368h634.982c16.21 0 29.399 13.179 29.399 29.368v254.925zM890.153 829.553h-300.892c-24.535 0-44.421-19.886-44.421-44.431 0-24.535 19.886-44.421 44.421-44.421h191.212c-1.843-1.341-3.686-2.703-5.345-4.372l-313.457-313.436v193.638c0 24.535-19.886 44.421-44.421 44.421-12.268 0-23.378-4.956-31.416-13.005-8.038-8.059-13.015-19.139-13.015-31.416v-300.902c0-24.525 19.886-44.421 44.421-44.421h300.892c24.535 0 44.421 19.896 44.421 44.442 0 24.525-19.886 44.421-44.421 44.421h-191.191c1.843 1.341 3.676 2.703 5.335 4.362l313.436 313.446v-193.649c0-24.535 19.886-44.421 44.421-44.421 12.268 0 23.378 4.956 31.416 13.005 8.038 8.059 13.015 19.149 13.015 31.416v300.902c0.010 24.525-19.886 44.421-44.411 44.421z" />
-<glyph unicode="&#xe934;" glyph-name="lk_right_arrow" d="M589.523 543.172v154.985l290.635-253.71-290.635-253.591v154.744h-477.064v197.572h477.064zM529.288 830.735v-227.328h-477.064v-318.042h477.064v-227.087l442.488 386.108-442.488 386.35z" />
-<glyph unicode="&#xe935;" glyph-name="lk_lozenge" d="M534.073 948.964l426.553-479.403c5.571-5.578 9.017-13.281 9.017-21.788s-3.445-16.21-9.017-21.789v0l-426.553-479.346c-5.578-5.571-13.281-9.017-21.788-9.017s-16.21 3.445-21.789 9.017v0l-426.553 479.346c-5.571 5.578-9.017 13.281-9.017 21.788s3.445 16.21 9.017 21.789v0l426.553 479.403c5.578 5.571 13.281 9.017 21.788 9.017s16.21-3.445 21.789-9.017v0zM527.815 833.081c-3.98 3.962-9.469 6.411-15.531 6.411s-11.55-2.449-15.531-6.412l0.001 0.001-325.291-369.778c-3.962-3.98-6.411-9.469-6.411-15.531s2.449-11.55 6.412-15.531l-0.001 0.001 325.291-370.005c3.983-3.979 9.484-6.44 15.559-6.44s11.576 2.461 15.559 6.44v0l333.483 370.005c3.979 3.983 6.44 9.484 6.44 15.559s-2.461 11.576-6.44 15.559v0z" />
-</font></defs></svg>

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/icomoon.svg

@@ -74,4 +74,5 @@
 <glyph unicode="&#xe940;" glyph-name="lk_reduce" d="M188.8 824.3c-29.7 0-53.8-24.1-53.8-53.7v-644.7c0-29.7 24.1-53.7 53.8-53.7h645.4c29.7 0 53.8 24.1 53.8 53.7v644.7c0 29.7-24.1 53.7-53.8 53.7h-645.4zM175.8 895.4h671.5c61.8 0 111.9-50.1 111.9-111.8v-670.8c0-61.7-50.1-111.8-111.9-111.8h-671.5c-61.8 0-111.9 50-111.9 111.8v670.8c0 61.8 50.1 111.8 111.9 111.8zM673 412h-322c-19.8 0-36 16.2-36 36s16.2 36 36 36h322c19.8 0 36-16.2 36-36s-16.2-36-36-36z" />
 <glyph unicode="&#xe941;" glyph-name="lk_edit" d="M860 456c-19.9 0-36-16.1-36-36 0-1.4 0.1-2.7 0.2-4h-0.2v-344h-688v688h376c19.9 0 36 16.1 36 36s-16.1 36-36 36h-376c-39.8 0-72-32.2-72-72v-688c0-39.8 32.2-72 72-72h688c39.8 0 72 32.2 72 72v344h-0.2c0.1 1.3 0.2 2.6 0.2 4 0 19.9-16.1 36-36 36zM1002.7 859.7l-79.3 79.3c-28.1 28.1-73.9 27.9-102-0.2l-397.2-397.2c-2.9-2.9-5.2-6.4-6.8-10.2l-99.8-235.4c-5.6-13.2-1.7-26.5 6.8-35.1s21.9-12.5 35.2-6.9l235.5 99.7c3.8 1.6 7.2 3.9 10.2 6.8l397.2 397.2c28.1 28.1 28.3 73.9 0.2 102zM559.8 417l-137.4-58.2 58.2 137.4 278.8 278.8 79.2-79.2-278.8-278.8zM951.5 808.7l-62-62-79.2 79.2 62.2 62.2 79.2-79.2-0.2-0.2z" />
 <glyph unicode="&#xe942;" glyph-name="lk_add" d="M780.007 1.27h-536.104c-98.6 0-178.613 79.969-178.613 178.613v536.105c0 98.731 80.013 178.745 178.613 178.745h536.105c98.773 0 178.701-80.013 178.701-178.745v-536.105c-0.001-98.643-79.928-178.613-178.702-178.613v0zM869.445 671.312c0 74.038-60.119 134.069-134.113 134.069h-446.753c-73.994 0-134.028-60.031-134.028-134.069v-446.666c0-74.124 60.033-134.069 134.028-134.069h446.753c73.994 0 134.113 59.945 134.113 134.069v446.666zM556.631 224.646h-89.351v178.613h-178.701v89.44h178.701v178.613h89.351v-178.613h178.701v-89.44h-178.701v-178.613z" />
+<glyph unicode="&#xe943;" glyph-name="lk_dotted_line" d="M180.181 102.187l90.453 90.496-45.227 45.269-90.496-90.496 45.227-45.269zM376.277 298.283l90.496 90.539-45.227 45.227-90.539-90.496 45.227-45.227zM572.373 494.379l90.496 90.539-45.227 45.227-90.539-90.496 45.269-45.227zM768.469 690.517l90.539 90.453-45.269 45.312-90.496-90.539 45.227-45.227z" />
 </font></defs></svg>

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/fonts/style.css

@@ -1,189 +0,0 @@
-@font-face {
-  font-family: 'icomoon';
-  src:  url('fonts/icomoon.eot?7w83vl');
-  src:  url('fonts/icomoon.eot?7w83vl#iefix') format('embedded-opentype'),
-    url('fonts/icomoon.ttf?7w83vl') format('truetype'),
-    url('fonts/icomoon.woff?7w83vl') format('woff'),
-    url('fonts/icomoon.svg?7w83vl#icomoon') format('svg');
-  font-weight: normal;
-  font-style: normal;
-  font-display: block;
-}
-
-[class^="icon-"], [class*=" icon-"] {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  font-family: 'icomoon' !important;
-  speak: never;
-  font-style: normal;
-  font-weight: normal;
-  font-variant: normal;
-  text-transform: none;
-  line-height: 1;
-
-  /* Better Font Rendering =========== */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-.icon-lk_lozenge:before {
-  content: "\e935";
-}
-.icon-lk_set_size:before {
-  content: "\e933";
-}
-.icon-lk_right_arrow:before {
-  content: "\e934";
-}
-.icon-lk_right_triangle:before {
-  content: "\e932";
-}
-.icon-lk_ellipse:before {
-  content: "\e92f";
-}
-.icon-lk_rect:before {
-  content: "\e931";
-}
-.icon-lk_triangle:before {
-  content: "\e92c";
-}
-.icon-lk_five_pointed:before {
-  content: "\e92e";
-}
-.icon-lk_circle:before {
-  content: "\e930";
-}
-.icon-lk_angular:before {
-  content: "\e92b";
-}
-.icon-lk_shape_stroke:before {
-  content: "\e92a";
-}
-.icon-lk_color_palette:before {
-  content: "\e92d";
-}
-.icon-lk_font_size:before {
-  content: "\e929";
-}
-.icon-lk_align_icon:before {
-  content: "\e928";
-}
-.icon-lk_align_h_center:before {
-  content: "\e925";
-}
-.icon-lk_align_bottom:before {
-  content: "\e926";
-}
-.icon-lk_align_top:before {
-  content: "\e927";
-}
-.icon-lk_align_right:before {
-  content: "\e922";
-}
-.icon-lk_align_center:before {
-  content: "\e923";
-}
-.icon-lk_align_left:before {
-  content: "\e924";
-}
-.icon-lk_shape_set:before {
-  content: "\e921";
-}
-.icon-lk_layer_set:before {
-  content: "\e920";
-}
-.icon-lk_border_angle:before {
-  content: "\e91f";
-}
-.icon-lk_line:before {
-  content: "\e91e";
-}
-.icon-lk_text:before {
-  content: "\e91d";
-}
-.icon-lk_warning_tips:before {
-  content: "\e91c";
-}
-.icon-lk_data_output:before {
-  content: "\e919";
-}
-.icon-lk_data_input:before {
-  content: "\e91a";
-}
-.icon-lk_start:before {
-  content: "\e91b";
-}
-.icon-lk_step_flow:before {
-  content: "\e918";
-}
-.icon-lk_success:before {
-  content: "\e915";
-}
-.icon-lk_failed:before {
-  content: "\e916";
-}
-.icon-lk_running:before {
-  content: "\e917";
-}
-.icon-lk_align_horizontal:before {
-  content: "\e900";
-}
-.icon-lk_align_vertical:before {
-  content: "\e901";
-}
-.icon-lk_close_x:before {
-  content: "\e902";
-}
-.icon-lk_color_eyedropper_tool:before {
-  content: "\e903";
-}
-.icon-lk_color_fill:before {
-  content: "\e904";
-}
-.icon-lk_down:before {
-  content: "\e905";
-}
-.icon-lk_file_template:before {
-  content: "\e906";
-}
-.icon-lk_font_bold:before {
-  content: "\e907";
-}
-.icon-lk_font_color:before {
-  content: "\e908";
-}
-.icon-lk_font_italic:before {
-  content: "\e909";
-}
-.icon-lk_icon_config:before {
-  content: "\e90a";
-}
-.icon-lk_minimap:before {
-  content: "\e90b";
-}
-.icon-lk_open:before {
-  content: "\e90c";
-}
-.icon-lk_plus_copy:before {
-  content: "\e90d";
-}
-.icon-lk_recover:before {
-  content: "\e90e";
-}
-.icon-lk_save:before {
-  content: "\e90f";
-}
-.icon-lk_tips:before {
-  content: "\e910";
-}
-.icon-lk_to_center:before {
-  content: "\e911";
-}
-.icon-lk_undo:before {
-  content: "\e912";
-}
-.icon-lk_zoom_in:before {
-  content: "\e913";
-}
-.icon-lk_zoom_out:before {
-  content: "\e914";
-}

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/icons/style.css

@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icomoon';
-  src:  url('fonts/icomoon.eot?5gmwxn');
-  src:  url('fonts/icomoon.eot?5gmwxn#iefix') format('embedded-opentype'),
-    url('fonts/icomoon.ttf?5gmwxn') format('truetype'),
-    url('fonts/icomoon.woff?5gmwxn') format('woff'),
-    url('fonts/icomoon.svg?5gmwxn#icomoon') format('svg');
+  src:  url('fonts/icomoon.eot?9hvowe');
+  src:  url('fonts/icomoon.eot?9hvowe#iefix') format('embedded-opentype'),
+    url('fonts/icomoon.ttf?9hvowe') format('truetype'),
+    url('fonts/icomoon.woff?9hvowe') format('woff'),
+    url('fonts/icomoon.svg?9hvowe#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -25,6 +25,9 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-lk_dotted_line:before {
+  content: "\e943";
+}
 .icon-lk_order_by:before {
   content: "\e93e";
 }

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/index.vue

@@ -9,7 +9,7 @@
         @on-menu-click="onMenuClick"/>
       <FunctionPrompt v-if="that.editState"/>
       <el-button v-if="that.editState" @click="previewData">预览</el-button>
-      <DesignPreviewDialog ref="designPreviewDialogRef" />
+      <DesignPreviewDialog ref="designPreviewDialogRef"/>
 
       <DynamicPropConfig ref="dynamicPropRef" @submit="submitProp"/>
       <DraftDesignLayout
@@ -29,7 +29,7 @@
               :class="['main-container']"
               :style="{ 'box-shadow': that.editState ? '0 0 10px 1px #eee;' : 'none',}">
             </div>
-<!--            <TeleportContainer/>-->
+            <!--            <TeleportContainer/>-->
           </div>
         </div>
       </DraftDesignLayout>
@@ -50,16 +50,16 @@ import {Selection} from '@antv/x6-plugin-selection'
 import {Dnd} from '@antv/x6-plugin-dnd'
 import {Export} from '@antv/x6-plugin-export'
 import {Clipboard} from '@antv/x6-plugin-clipboard'
-import {graphOptions,  setDraftDesignState, ShapeType} from './config/index'
+import {graphOptions, setDraftDesignState, ShapeType} from './config/index'
 import DraftDesignLayout from './components/layout/index.vue'
-import { computed, onMounted} from 'vue'
+import {computed, onMounted} from 'vue'
 import {
   nextId,
   logInfo,
   mergeDeepObject, objectHasKey,
 } from "@/components/DraftDesign/utils/FuncUtil";
 
-import {register, getTeleport} from '@antv/x6-vue-shape'
+import {register} from '@antv/x6-vue-shape'
 
 import './icons/style.css'
 
@@ -82,10 +82,12 @@ import ShapeLozengeNode from "@/components/DraftDesign/components/node/ShapeLoze
 import ShapeImageNode from "@/components/DraftDesign/components/node/ShapeImageNode.vue";
 import {useMessage} from "@/hooks/web/useMessage";
 import DesignPreviewDialog from "@/components/DraftDesign/components/DesignPreviewDialog.vue";
+import DottedLineNode from "@/components/DraftDesign/components/node/DottedLineNode.vue";
+
 let regSate = false;
-const regNode = ()=>{
+const regNode = () => {
   console.log("regNode", regSate)
-  if(!regSate){
+  if (!regSate) {
     regSate = true;
     register({
       shape: ShapeType.vueTextCell,
@@ -99,6 +101,12 @@ const regNode = ()=>{
       height: 80,
       component: LineCellNode,
     })
+    register({
+      shape: ShapeType.vueDottedLineCell,
+      width: 80,
+      height: 6,
+      component: DottedLineNode,
+    })
     register({
       shape: ShapeType.vueShapeCell,
       width: 80,
@@ -161,8 +169,6 @@ const regNode = ()=>{
     })
   }
 }
-const TeleportContainer = defineComponent(getTeleport());
-
 // @ts-nocheck
 const emit = defineEmits(["save"])
 const {t} = useI18n() // 国际化
@@ -255,37 +261,41 @@ const rightKeyMenu = computed(() => {
 
     let imageCount = 0;
     let textCount = 0;
-    if (that.selectedCellsList.length === 2) {
+    if (that.selectedCellsList.length >0) {
       for (let i = 0; i < tmpList.length; i++) {
         if (tmpList[i].shape === ShapeType.vueShapeImage || tmpList[i].shape === ShapeType.vueTextCell) {
           if (tmpList[i].shape === ShapeType.vueShapeImage) {
             imageCount++;
+            break;
           } else {
             textCount++;
           }
         }
       }
     }
-    if (imageCount === 1 && textCount === 1) {
+    if (imageCount >= 1) {
       arr.push({
         value: 'mergeGroup',
         icon: 'icon-lk_cell_add',
         disabled: disabledMenu.value,
-        label: '组合属性',
+        label: '设置洗涤说明',
         handler: (item) => {
           const cells = that.selectedCellsList
           if (cells.length === 0) {
             useMessage().warning(`没有选中元素`)
           }
-          let arr = [
-            cells[0],
-            cells[1]
-          ]
-          if (cells[0].shape === ShapeType.vueShapeImage) {
-            arr[0] = cells[1]
-            arr[1] = cells[0]
+          let cellInfo = cells[0];
+          if(cells[0] !== ShapeType.vueShapeImage){
+            // 第一是图片
+            for (let i = 0; i < cells.length; i++) {
+              if (cells[i].shape === ShapeType.vueShapeImage) {
+                const tmp = cells[0]
+                cells[0] = cells[i]
+                cells[i] = tmp
+              }
+            }
           }
-          handlerGroupList(arr, true,2,2)
+          handlerGroupList(cells, true, 2, cells.length)
         }
       })
     } else if (that.selectedCellsList.length > 0) {
@@ -307,7 +317,7 @@ const rightKeyMenu = computed(() => {
               break;
             }
           }
-          handlerGroupList(cells, false,m,max)
+          handlerGroupList(cells, false, m, max)
         }
       })
     }
@@ -400,7 +410,7 @@ const rightKeyMenu = computed(() => {
 });
 
 const clearData = () => {
-  console.log("clearData",graph)
+  console.log("clearData", graph)
   if (graph) {
     graph.fromJSON({})
     graph.dispose()
@@ -642,9 +652,9 @@ const init = (isDesignMode: boolean, bgConfig: any, data = {}, propDataInfo = {}
     addDrawRuler()
     draftDesignLayoutRef.value.updateZoom(graph.zoom());
   })
-  console.log("init",data)
+  console.log("init", data)
   // 默认数据
-  graph.fromJSON( {...data}) // 渲染元素
+  graph.fromJSON({...data}) // 渲染元素
 
   // 加载属性组信息
   if (!that.editState) {
@@ -687,9 +697,9 @@ const toPngUrl = (callback: (url: string) => void, options?: {
     bottom: number
   }
 }) => {
+
   let widthScale = options && options.widthScale ? options.widthScale : 5
   let heightScale = options && options.heightScale ? options.heightScale : 5
-
   graph.toPNG((dataUri) => {
     that.previewUrl = dataUri;
     callback(that.previewUrl)
@@ -719,7 +729,7 @@ const setPropList = (propDataInfo) => {
         break;
       }
     }
-    console.log("list", list)
+
     let useId = []
     const len = Math.min(propDataInfo[groupId].dataInfo.length, list.length)
     for (let j = 0; j < len; j++) {
@@ -773,11 +783,11 @@ const initBindKey = () => {
     handlerCopy();
     return false
   })
-  graph.bindKey('meta+s', 'ctrl+s', function(event) {
+  graph.bindKey('meta+s', 'ctrl+s', function (event) {
     return false;
   });
 
-  document.addEventListener('keydown', function(event) {
+  document.addEventListener('keydown', function (event) {
     if (event.ctrlKey && event.key === 's') {
       event.preventDefault();
       // 这里处理 Ctrl+S 被按下的逻辑
@@ -900,8 +910,17 @@ const handlerCopy = () => {
 // 粘贴
 const handlerPaste = () => {
   if (!graph.isClipboardEmpty()) {
-    const cells = graph.paste({offset: {dx: 0, dy: 60}})
+    const cells = graph.paste({offset: {dx: 0, dy: 20}})
     graph.cleanSelection()
+    for (let i = 0; i < cells.length; i++) {
+
+      cells[i].setData({
+        // status: 'running',
+        _$id: new Date().getTime(), // 刷新数据
+        ...cells[i].getData,
+        id: 'id_' + nextId(),
+      })
+    }
     graph.select(cells)
   }
 }
@@ -1039,23 +1058,6 @@ const addDrawRuler = () => {
 
 onMounted(() => {
 
-  // const r = localStorage.getItem("tem_data")
-  // if (r) {
-  //   const conf = JSON.parse(r)
-  //   const test = {
-  //     g_kn7c4vzgf9a:{
-  //       dataInfo: [
-  //         {
-  //           url: '',
-  //           label: '100%聚酯纤维',
-  //         }
-  //       ]
-  //     }
-  //   }
-  //   init(true, conf.pageConfig, conf.data, test);
-  // } else {
-  // }
-  // init(true, {});
 })
 const btnEventHandler = {
   'canUndo': (val) => {
@@ -1099,18 +1101,19 @@ const getJson = () => {
     }
     let min = prop.minSize ? prop.minSize : 1;
     let max = prop.maxSize ? prop.maxSize : dataInfoList.length;
-    let combo =  prop.isCombo === undefined ? false : prop.isCombo;
+    let combo = prop.isCombo === undefined ? false : prop.isCombo;
     let canChange = prop.canChange === undefined ? false : prop.canChange;
     let canInput = prop.canInput === undefined ? false : prop.canInput;
 
-    if (combo){
+    if (combo) {
       min = dataInfoList.length;
       max = dataInfoList.length;
       canChange = false;
     }
     propDefault[prop.groupId] = {
       groupName: prop.groupName,
-      isCombo:combo,
+      groupType: prop.groupType,
+      isCombo: combo,
       minSize: min,
       maxSize: max,
       canChange: canChange,
@@ -1122,7 +1125,6 @@ const getJson = () => {
   that.pageConfig.propDefault = propDefault
   that.pageConfig.onLoadZoom = that.currentGraphZoom;
   that.jsonData.pageConfig = that.pageConfig
-  console.log("that.jsonData", that.pageConfig.propDefault)
   localStorage.setItem("tem_data", JSON.stringify(that.jsonData))
   return that.jsonData
 }
@@ -1226,6 +1228,7 @@ const onAddNode = (e, item) => {
   }
   if (item) {
     const id = 'id_' + nextId()
+    console.log("id",id)
     const shape = item.shape
     let nodeOptions = {
       // id: id,
@@ -1252,9 +1255,9 @@ const onAddNode = (e, item) => {
       ports: {},// 初始连接桩
       data: { // 业务数据
         shape,
-        id,
         label: '',
         ...item.data,
+        id,
         parent: that.pageConfig?.autoSetNodeGroup || false
       }
     }
@@ -1297,12 +1300,17 @@ const markGroup = (cellInfo, groupId, groupName) => {
     propGroupName: groupName,
   })
 }
-const handlerGroupList = (cells, isCombo = false,min,max) => {
+function getRandomHashColor() {
+  // 生成一个 6 位数的随机十六进制数，并在前面加上 #
+  return  Math.floor(Math.random() * 0xffffff).toString(16).padStart(6, '0');
+}
+const handlerGroupList = (cells, isCombo = false, min, max) => {
 
   let tmpPoint = []
   let info = undefined;
-  let groupId = `g_${Math.random().toString(36).substring(2)}`
+  let groupId = `g${nextId()}_${getRandomHashColor()}`
   let groupName = ''
+  let groupType = '1'
   let type = cells[0].shape
   for (let i = 0; i < cells.length; i++) {
     const cellInfo = cells[i];
@@ -1312,6 +1320,7 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
       continue;
     }
     groupName = `${cellData.label}`
+
     let href = '';
     let label = '';
     if (cellData.propGroupId) {
@@ -1321,6 +1330,15 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
     if (cellData.propGroupName) {
       groupName = cellData.propGroupName
     }
+    if (isCombo) {
+      groupType = '2' // 洗涤说明
+      groupName = groupName ? groupName : '洗涤说明1'
+    } else {
+      if (cellData.propGroupType) {
+        groupType = cellData.propGroupType || '1'
+      }
+    }
+
 
     if (cellInfo.shape === ShapeType.vueShapeImage) {
       href = cellData.style.shape.href;
@@ -1337,11 +1355,14 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
           width: cellInfo.width,
           height: cellInfo.height,
           propGroupId: groupId,
+          propGroupType: groupType,
           propGroupName: groupName,
         },
         shape: cellInfo.shape,
       }
     }
+    // 清除后缀
+    label = `${label}`.split(".")[0]
     tmpPoint.push({
       ...cellInfo.position(),
       angle: cellInfo.angle(),
@@ -1350,7 +1371,9 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
       cellId: cellInfo.id,
       dataInfo: {
         url: href,
-        label: label
+        ratio: 0,
+        label: label,
+        showLabel: label
       }
     })
   }
@@ -1368,6 +1391,7 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
   dynamicPropRef.value.init([], {
     groupId: groupId,
     groupName: groupName,
+    groupType: groupType,
     isCombo: isCombo, // 配对组合  第一个为文本 第二为图标
     minSize: min,
     maxSize: max,
@@ -1380,13 +1404,15 @@ const handlerGroupList = (cells, isCombo = false,min,max) => {
   dynamicPropRef.value.updateVisible(true);
 }
 const removeGroup = (groupId) => {
+
   for (let i = 0; i < that.pageConfig.propList.length; i++) {
     if (that.pageConfig.propList[i].groupId === groupId) {
       that.pageConfig.propList.splice(i, 1)
-      that.pageConfig.propOrderByList = that.pageConfig.propOrderByList.filter(item => item.groupId !== groupId)
       break;
     }
   }
+  removeEmptyGroup();
+  draftDesignLayoutRef.value.updatePropList(orderByPropList())
 }
 const updateGroupData = (nodeId, dataInfo) => {
   const node = graph.getCellById(nodeId)
@@ -1462,19 +1488,37 @@ const submitProp = (data) => {
     data.cellIds.push(newNode.id)
     graph.addNode(newNode)
   }
-
   removeGroup(data.groupId);
   data.maxSize = Math.min(data.pointList.length, data.maxSize)
-  console.log("data",data)
   that.pageConfig.propList.push(data)
   dynamicPropRef.value.updateVisible(false)
-
   draftDesignLayoutRef.value.updatePropList(orderByPropList())
+
 }
-const propListChange = (list)=>{
+const propListChange = (list) => {
   that.pageConfig.propOrderByList = [...list]
 }
-const orderByPropList = ()=>{
+const removeEmptyGroup = () => {
+  const cells = graph.getCells();
+  let propGroupIdList = []
+  for (let i = 0; i < cells.length; i++) {
+    if(cells[i].getData && cells[i].getData().propGroupId){
+      propGroupIdList.push( cells[i].getData().propGroupId)
+    }
+  }
+
+  let delIndex = []
+  for (let i = 0; i < that.pageConfig.propList.length; i++) {
+    if(!propGroupIdList.includes(that.pageConfig.propList[i].groupId)){
+      delIndex.push(i)
+    }
+  }
+  for (let i = 0; i < delIndex.length; i++) {
+    that.pageConfig.propList.splice(delIndex[i], 1)
+  }
+}
+const orderByPropList = () => {
+
   let keys = {};
   let arr = []
   for (let i = 0; i < that.pageConfig.propOrderByList.length; i++) {
@@ -1483,14 +1527,14 @@ const orderByPropList = ()=>{
   }
   const ids = Object.keys(keys);
   for (let i = 0; i < that.pageConfig.propList.length; i++) {
-    if(ids.includes(that.pageConfig.propList[i].groupId)){
-      arr.splice(keys[that.pageConfig.propList[i].groupId],1,{
+    if (ids.includes(that.pageConfig.propList[i].groupId)) {
+      arr.splice(keys[that.pageConfig.propList[i].groupId], 1, {
         key: that.pageConfig.propList[i].groupId,
         name: that.pageConfig.propList[i].groupName,
         shape: that.pageConfig.propList[i].shape,
         isCombo: that.pageConfig.propList[i].isCombo
       })
-    }else{
+    } else {
       arr.push({
         key: that.pageConfig.propList[i].groupId,
         name: that.pageConfig.propList[i].groupName,
@@ -1499,30 +1543,32 @@ const orderByPropList = ()=>{
       })
     }
   }
-  // that.pageConfig.propOrderByList
+
   return arr
 }
 const getPropInfo = () => {
   return {
-    propDefault:that.pageConfig.propDefault, // 默认属性
+    propDefault: that.pageConfig.propDefault, // 默认属性
     propList: that.pageConfig.propList, // 实时属性
     propOrderByList: orderByPropList() // 顺序属性
   }
 }
-const previewData = ()=>{
+const previewData = () => {
   designPreviewDialogRef.value.preview(getJson());
 }
 defineExpose({
   init,
   getPropInfo,
   toPngUrl,
-  clearData
+  clearData,
+  getJson,
 })
 </script>
 
 <style>
 
 .node-content-group {
+  --lk-prop-group-color: #00ff00;
   box-shadow: 0 0 1px 1px rgb(186, 186, 186);
   position: relative;
 }
@@ -1535,7 +1581,7 @@ defineExpose({
   z-index: 1;
   border-style: solid;
   border-width: 0 5px 5px 5px;
-  border-color: transparent transparent transparent #00ff00;
+  border-color: transparent transparent transparent var(--lk-prop-group-color);
 }
 </style>
 <style scoped lang="scss">

hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/utils/Dpi.ts

@@ -37,26 +37,22 @@ export function calcDpiFromSize( screenSize=16,opt = 'd'){
   return calcDpi(widthValue, heightValue, screenSize, opt);
 }
 const tmpImage = {}
-export function convertImageToBase64(url) {
-  return new Promise(async (resolve, reject)=>{
-    FileApi.getDomain().then(async (domain) => {
-      url =  replaceDomain(domain, url)
-      if(tmpImage[url]){
-        resolve(tmpImage[url]);
-        console.log('缓存')
-        return;
-      }
-      try {
-        const response = await fetch(url);
-        const blob = await response.blob();
-        const base = `data:${response.headers.get('content-type')};base64,${btoa(String.fromCharCode(...new Uint8Array(await blob.arrayBuffer())))}`
-        tmpImage[url] = base
-        resolve(base)
-      }catch (e) {
-        resolve(url);
-      }
-    })
-
+export function convertImageToBase64(url:string) {
+  return new Promise(async (resolve)=>{
+    if(tmpImage[url]){
+      resolve(tmpImage[url]);
+      console.log('缓存')
+      return;
+    }
+    try {
+      const response = await fetch(url);
+      const blob = await response.blob();
+      const base = `data:${response.headers.get('content-type')};base64,${btoa(String.fromCharCode(...new Uint8Array(await blob.arrayBuffer())))}`
+      tmpImage[url] = base
+      resolve(base)
+    }catch (e) {
+      resolve(url);
+    }
   })
 
 }

hangtag-ui/hangtag-ui-admin/src/components/Editor/src/Editor.vue

@@ -40,7 +40,7 @@ watch(
   () => props.modelValue,
   (val: string) => {
     if (val === unref(valueHtml)) return
-    valueHtml.value = val
+    valueHtml.value = val ? val : ''
   },
   {
     immediate: true

hangtag-ui/hangtag-ui-admin/src/components/Form/src/Form.vue

@@ -213,7 +213,7 @@ export default defineComponent({
         }
       }
       return (
-        <ElFormItem {...(item.formItemProps || {})} prop={item.field} label={item.label || ''}>
+        <ElFormItem class="min-w-80" {...(item.formItemProps || {})} prop={item.field} label={item.label || ''}>
           {{
             ...formItemSlots,
             default: () => {

hangtag-ui/hangtag-ui-admin/src/components/Table/src/Table.vue

@@ -49,7 +49,7 @@ export default defineComponent({
       default: () => []
     }
   },
-  emits: ['update:pageSize', 'update:currentPage', 'register'],
+  emits: ['update:pageSize', 'update:currentPage', 'register','selectionChange'],
   setup(props, { attrs, slots, emit, expose }) {
     const elTableRef = ref<ComponentRef<typeof ElTable>>()
 
@@ -96,6 +96,7 @@ export default defineComponent({
 
     const selectionChange = (selection: Recordable[]) => {
       selections.value = selection
+      emit("selectionChange", selection)
     }
 
     expose({

hangtag-ui/hangtag-ui-admin/src/utils/dict.ts

@@ -215,5 +215,7 @@ export enum DICT_TYPE {
   // ========== OMS模块  ==========
   OMS_DATA_STATUS = 'oms_data_status', // 数据状态
   OMS_BILL_STATUS = 'oms_bill_status', // 单据状态
-  OMS_ORDER_STATUS = 'oms_order_status' // 订单状态
+  OMS_ORDER_STATUS = 'oms_order_status',// 订单状态
+  OMS_PRODUCT_CARE_ITEM_TYPE = 'oms_product_care_item_type', //产品保养项目类型 1.成分说明 2.洗涤说明 3.使用说明 4.尺码
+
 }

hangtag-ui/hangtag-ui-admin/src/views/oms/draftdesigndata/detials/index.vue

@@ -94,9 +94,11 @@ const formRules = reactive({
   name: [{ required: true, message: '设计稿名称不能为空', trigger: 'blur' }],
 })
 const formRef = ref() // 表单 Ref
-
+const copyData = ref(false)
 onMounted(()=>{
   formData.value.id = route.query.id
+  copyData.value = route.query.copy
+  console.log("copyData.value",copyData.value)
   formType.value = formData.value.id ?  'update' : 'create'
   open(formType.value,formData.value.id)
 
@@ -116,6 +118,13 @@ const open = async (type: string, id?: number) => {
       const res = await DraftDesignDataApi.getDraftDesignData(id)
       if(res){
         formData.value = res
+        if(copyData.value){
+          formData.value.id = undefined
+          formData.value.code = undefined
+          formData.value.name = formData.value.name + '(复制)'
+          formData.value.version = 1;
+          formType.value = 'create'
+        }
         const j = formData.value.details || "{}"
         const d = JSON.parse(j)
         // true, conf.pageConfig, conf.data, test

hangtag-ui/hangtag-ui-admin/src/views/oms/draftdesigndata/index.vue

@@ -129,6 +129,13 @@
               编辑
             </el-button>
           </router-link>
+          <router-link  v-hasPermi="['oms:draft-design-data:create']" :to="'/base/oms/draftdesigndata/detials?copy=true&id='+ scope.row.id">
+            <el-button
+              link
+              type="primary">
+              复制
+            </el-button>
+          </router-link>
           <el-button
             link
             type="danger"

hangtag-ui/hangtag-ui-admin/src/views/oms/productcareitem/ProductCareItemForm.vue

@@ -2,115 +2,178 @@
   <Dialog
     :title="dialogTitle"
     width="68vw"
-          v-model="dialogVisible">
+    v-model="dialogVisible">
 
     <el-scrollbar height="60vh">
       <div>
-      <el-form
-        ref="formRef"
-        :model="formData"
-        :rules="formRules"
-        label-width="100px"
-        v-loading="formLoading"
-      >
-        <el-form-item label="保养项名称" prop="value">
-          <el-input :name="`_$_ProductCareItemForm_value`" :autocomplete="`_$_ProductCareItemForm_value`" v-model="formData.value" clearable placeholder="请输入保养项名称" />
-        </el-form-item>
-        <el-form-item label="icon图标" prop="iconUrl">
-          <DraftDesignImageLibDialog v-model="formData.iconUrl" placeholder="请输入icon图标" @submit="changeIcon" />
-        </el-form-item>
+        <el-form
+          ref="formRef"
+          :model="formData"
+          :rules="formRules"
+          label-width="100px"
+          v-loading="formLoading"
+        >
+          <el-form-item label="名称" prop="value">
+            <el-input
+              :name="`_$_ProductCareItemForm_value`"
+              :autocomplete="`_$_ProductCareItemForm_value`"
+              v-model="formData.value"
+              clearable
+              placeholder="请输入名称"/>
+          </el-form-item>
+          <el-form-item label="类型" prop="value">
+            <el-select v-model="formData.type">
+              <el-option
+                v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
+                :key="`${dict.value}`"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
 
-        <el-form-item label="品牌通用" prop="isAll">
-          <el-checkbox v-model="formData.isAll">该保养说明适用于所有品牌</el-checkbox>
-        </el-form-item>
+          <el-form-item label="洗涤图标" v-show="formData.type === '2'" prop="iconUrl">
+            <DraftDesignImageLibDialog v-model="formData.iconUrl" placeholder="请输入icon图标" @submit="changeIcon"/>
+          </el-form-item>
 
-        <el-form-item v-if="!formData.isAll" label="品牌" prop="brandIds">
-          <span>改说明只适用于指定品牌</span>
-          <el-input v-model="formData.brandIds" placeholder="请输入品牌" />
-        </el-form-item>
+          <el-form-item label="品牌通用" prop="isAll">
+            <el-checkbox v-model="formData.isAll">该保养说明适用于所有品牌</el-checkbox>
+          </el-form-item>
 
-        <el-form-item label="作用于组合" prop="isCombo">
-          <el-checkbox v-model="formData.isCombo">是否只作用于组合(洗涤说明icon和文本)</el-checkbox>
-        </el-form-item>
+          <el-form-item v-show="!formData.isAll" label="品牌专属" prop="brandIds">
+            <div>
+              <div>用于指定品牌</div>
+              <div>
+                <BrandDataListDialog
+                  class="w-full"
+                  v-model="formData.brandIds"
+                  multiple
+                  placeholder="请选择品牌"/>
+              </div>
+            </div>
+          </el-form-item>
 
-        <el-form-item label="多语言配置" prop="lang_mapping">
-          <div class="w-full">
-            <el-collapse accordion v-model="langeActiveName">
-              <el-collapse-item name="1">
-                <template #title>
-                  多语言对照列表
-                </template>
-                <div>
-                  <el-button @click="addLangMapping">添加</el-button>
-                  <el-table  :data="that.langList" :stripe="true" :show-overflow-tooltip="true">
-                    <el-table-column prop="locale" label="地区语言" width="150" >
-                      <template #default="scope">
-                        <el-select v-model="scope.row.locale" placeholder="地区语言">
-                          <el-option
-                            v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
-                            :key="`${dict.value}`"
-                            :label="dict.label"
-                            :value="dict.value"
-                          />
-                        </el-select>
+          <el-form-item label="多语言配置" prop="langMapping">
+            <div class="w-full">
+              <el-collapse accordion v-model="langeActiveName">
+                <el-collapse-item name="1">
+                  <template #title>
+                    <span> 多语言对照列表</span>
+                  </template>
+                  <div>
+                    <el-button @click="addLangMapping">添加</el-button>
+                    <el-tooltip>
+                      <template #content>
+                        <div>将多种语言内容拼接到一起</div>
                       </template>
-                    </el-table-column>
+                      <el-checkbox class="m-4" v-model="formData.isCombo">多语言拼接</el-checkbox>
+                    </el-tooltip>
+                    <el-alert
+                      title="多语言内容可使用${r}作为占位符如：白鹅绒${r}%以上, 客户填写 60时, 结果为: 白鹅绒60%以上"
+                      type="info" effect="dark"/>
+                    <el-table
+                      :data="that.langList"
+                      :stripe="true"
+                      :show-overflow-tooltip="true">
+                      <el-table-column width="55">
+                        <template #header>
+                          <div>
+                            <span>行号</span>
+                          </div>
+                        </template>
+                        <template #default="scope">
+                          <span>{{ scope.$index + 1 }}</span>
+                        </template>
+                      </el-table-column>
+                      <el-table-column prop="locale" label="地区语言" width="180">
+                        <template #header>
+                          <div>
+                            <span class="color-red">*</span>
+                            <span>地区语言</span>
+                          </div>
+                        </template>
+                        <template #default="scope">
 
-                    <el-table-column prop="value" label="多语言内容" >
-                      <template #default="scope">
-                        <el-input v-model="scope.row.value" placeholder="请输入多语言内容" />
-                      </template>
-                    </el-table-column>
+                          <div
+                            :class="{ 'duplicate-tips' : duplicateCheck(scope.row.locale) }">
+                            <el-select v-model="scope.row.locale" placeholder="地区语言">
+                              <el-option
+                                v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
+                                :key="`${dict.value}`"
+                                :label="dict.label"
+                                :value="dict.value"
+                              />
+                            </el-select>
+                          </div>
+                        </template>
+                      </el-table-column>
 
-                    <el-table-column prop="value" label="操作" >
-                      <template #default="{$index}">
-                        <el-button type="danger" @click="removeRow($index) " >删除</el-button>
-                      </template>
-                    </el-table-column>
+                      <el-table-column prop="value">
+                        <template #header>
+                          <div>
+                            <span class="color-red">*</span>
+                            <span>多语言内容</span>
+                          </div>
+                        </template>
+                        <template #default="scope">
+                          <el-input v-model="scope.row.value" placeholder="请输入多语言内容"/>
+                        </template>
+                      </el-table-column>
+                      <el-table-column prop="linkChar" label="连接符" width="120">
+                        <template #default="scope">
+                          <el-input v-model="scope.row.linkChar" placeholder="连接符"/>
+                        </template>
+                      </el-table-column>
+                      <el-table-column prop="value" label="操作" width="80">
+                        <template #default="{$index}">
+                          <el-button size="small" type="danger" @click="removeRow($index) ">删除
+                          </el-button>
+                        </template>
+                      </el-table-column>
 
-                  </el-table>
-                </div>
-              </el-collapse-item>
-            </el-collapse>
-          </div>
-
-        </el-form-item>
-
-        <el-form-item label="语言标识" prop="locale">
-          <el-select v-model="formData.locale" placeholder="请选择语言标识">
-            <el-option
-              v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
-              :key="`${dict.value}`"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="启用状态" prop="enabled">
-          <el-checkbox  v-model="formData.enabled">是否启用</el-checkbox>
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
-        </el-form-item>
-      </el-form>
-    </div>
+                    </el-table>
+                  </div>
+                </el-collapse-item>
+              </el-collapse>
+            </div>
+          </el-form-item>
+          <el-form-item label="地区标识" prop="locale">
+            <el-select v-model="formData.locale" placeholder="请选择语言标识">
+              <el-option
+                v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
+                :key="`${dict.value}`"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="启用状态" prop="enabled">
+            <el-checkbox v-model="formData.enabled">是否启用</el-checkbox>
+          </el-form-item>
+          <el-form-item label="备注" prop="remark">
+            <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注"/>
+          </el-form-item>
+        </el-form>
+      </div>
     </el-scrollbar>
     <template #footer>
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">{{t('common.ok')}}</el-button>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">{{ t('common.ok') }}
+      </el-button>
       <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
 <script setup lang="ts">
-import { getStrDictOptions, DICT_TYPE } from '@/utils/dict'
-import { ProductCareItemApi, ProductCareItemVO } from '@/api/oms/productcareitem'
+import {getStrDictOptions, DICT_TYPE} from '@/utils/dict'
+import {ProductCareItemApi, ProductCareItemVO} from '@/api/oms/productcareitem'
 import DraftDesignImageLibDialog from "@/components/Dialog/src/DraftDesignImageLibDialog/index.vue";
+import BrandDataListDialog from "@/components/Dialog/src/BrandDataListDialog/index.vue";
 
 
 /** 产品保养项  表单 */
-defineOptions({ name: 'ProductCareItemForm' })
+defineOptions({name: 'ProductCareItemForm'})
 
-const { t } = useI18n() // 国际化
+const {t} = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
@@ -122,33 +185,49 @@ const formData = ref({
   id: undefined,
   value: undefined,
   iconUrl: '',
-  brandIds: undefined,
-  isCombo: false,
+  type: '1',
+  brandIds: '',
+  isCombo: true,
   isAll: true,
   locale: 'zh-CN',
+  langMapping: '',
   enabled: true,
   remark: "",
 })
 const langeActiveName = ref('1');
 const formRules = reactive({
-  value: [{ required: true, message: '说明不能为空', trigger: 'blur' }],
+  value: [{required: true, message: '说明不能为空', trigger: 'blur'}],
 })
 const formRef = ref() // 表单 Ref
 const that = reactive({
   langList: [{
-    locale: '',
-    value: '',
+    locale: 'zh-CN', // 语言标识
+    value: '', // 翻译内容
+    linkChar: '', // 连接符
   }],
 })
-
+const duplicateCheck = (lang: string) => {
+  let count = 0;
+  for (let i = 0; i < that.langList.length; i++) {
+    if (that.langList[i].locale === lang) {
+      count++;
+    }
+  }
+  return count > 1;
+}
 const addLangMapping = () => {
   that.langList.push({
     locale: '',
     value: '',
+    linkChar: '',
   })
 }
 const removeRow = (index) => {
-
+  if (that.langList.length > 1) {
+    that.langList.splice(index, 1)
+  } else {
+    message.error('至少需要一个多语言内容')
+  }
 }
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
@@ -161,16 +240,18 @@ const open = async (type: string, id?: number) => {
     formLoading.value = true
     try {
       formData.value = await ProductCareItemApi.getProductCareItem(id)
+      console.log(" formData.value", formData.value)
+      that.langList = JSON.parse(formData.value.langMapping || '{}')
     } finally {
       formLoading.value = false
     }
   }
 }
 
-const changeIcon = (info)=>{
-  console.log("info",info)
+const changeIcon = (info) => {
+  console.log("info", info)
 }
-defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+defineExpose({open}) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
@@ -181,6 +262,24 @@ const submitForm = async () => {
   formLoading.value = true
   try {
     const data = formData.value as unknown as ProductCareItemVO
+    let countInfo = {};
+    for (let i = 0; i < that.langList.length; i++) {
+      const l = that.langList[i].locale
+      if (!l) {
+        message.error(`第${i + 1}行语言不能为空`)
+        return;
+      }
+      if (!that.langList[i].value) {
+        message.error(`第${i + 1}行翻译内容不能为空`)
+        return;
+      }
+      if (countInfo[l]) {
+        message.error(`${l} 翻译内容重复`)
+        return;
+      }
+      countInfo[l] = 1;
+    }
+    data.langMapping = JSON.stringify(that.langList)
     if (formType.value === 'create') {
       await ProductCareItemApi.createProductCareItem(data)
       message.success(t('common.createSuccess'))
@@ -201,14 +300,27 @@ const resetForm = () => {
   formData.value = {
     id: undefined,
     value: undefined,
-    inputVal: '',
-    brandIds: undefined,
-    isCombo: false,
+    type: '1',
+    brandIds: '',
+    iconUrl: '',
+    isCombo: true,
     isAll: true,
     locale: 'zh-CN',
+    langMapping: '',
     enabled: true,
     remark: "",
   }
+  that.langList = [{
+    locale: 'zh-CN', // 语言标识
+    value: '', // 翻译内容
+    linkChar: '', // 连接符
+  }]
   formRef.value?.resetFields()
 }
 </script>
+
+<style scoped lang="scss">
+.duplicate-tips {
+  box-shadow: 2px 0 0 2px rgba(255, 0, 0, 0.85);;
+}
+</style>

hangtag-ui/hangtag-ui-admin/src/views/oms/productcareitem/index.vue

@@ -103,13 +103,6 @@
           <dict-tag :type="DICT_TYPE.LANGUAGE_LOCALE" :value="scope.row.locale" />
         </template>
       </el-table-column>
-      <el-table-column label="只作用于组合" align="center" prop="isCombo" >
-        <template #default="scope">
-          <div>
-            {{scope.row.isCombo ? '是' : '否'}}
-          </div>
-        </template>
-      </el-table-column>
       <el-table-column label="启用状态" align="center" prop="enabled" >
         <template #default="scope">
             <div>

hangtag-ui/hangtag-ui-admin/src/views/oms/productinfo/ProductInfoForm.vue

@@ -12,8 +12,6 @@
         label-width="100px"
         v-loading="formLoading"
       >
-
-
         <el-row>
           <el-col :span="12" :xs="24">
             <el-form-item label="产品编码" prop="code">
@@ -40,30 +38,85 @@
         </el-row>
         <el-row>
           <el-col :span="12" :xs="24">
-
             <el-form-item label="产品名称" prop="name">
               <el-input v-model="formData.name" placeholder="请输入产品名称"/>
             </el-form-item>
           </el-col>
           <el-col :span="12" :xs="24">
-            <el-form-item label="设计稿" prop="draftDesignDataId">
-              <DraftDesignDataListDialog v-model="formData.draftDesignDataId"  />
+            <el-form-item label="封面" prop="cover">
+              <UploadImg v-model="formData.cover"/>
             </el-form-item>
           </el-col>
-          <el-form-item label="封面" prop="cover">
-            <UploadImg v-model="formData.cover"/>
-          </el-form-item>
+
         </el-row>
 
+        <el-form-item label="设计稿" prop="draftDesignDataId">
+          <!--          <DraftDesignDataListDialog v-model="formData.draftDesignDataId"  />-->
+          <div style="width: calc(100% - 20px);">
+            <el-button @click="addRow">添加</el-button>
+            <el-scrollbar max-height="400px">
+              <div class="w-full">
+                <el-table
+                  :data="that.draftDesignList"
+                  :stripe="true"
+                  :show-overflow-tooltip="true">
+                  <el-table-column width="55">
+                    <template #header>
+                      <div>
+                        <span>行号</span>
+                      </div>
+                    </template>
+                    <template #default="scope">
+                      <span>{{ scope.$index + 1 }}</span>
+                    </template>
+                  </el-table-column>
+                  <el-table-column prop="id">
+                    <template #header>
+                      <div>
+                        <span class="color-red">*</span>
+                        <span>设计稿</span>
+                      </div>
+                    </template>
+                    <template #default="scope">
+                      <div
+                        :class="{ 'duplicate-tips' : duplicateCheck(scope.row.id)}">
+                        <DraftDesignDataListDialog v-model="that.draftDesignList[scope.$index].id"/>
+                      </div>
+                    </template>
+                  </el-table-column>
+
+                  <el-table-column prop="label" width="280">
+                    <template #header>
+                      <div>
+                        <span class="color-red">*</span>
+                        <span>风格名称</span>
+                      </div>
+                    </template>
+                    <template #default="scope">
+                      <el-input v-model="scope.row.label" placeholder="请输入风格名称"/>
+                    </template>
+                  </el-table-column>
+                  <el-table-column prop="value" label="操作" width="80">
+                    <template #default="{$index}">
+                      <el-button size="small" type="danger" @click="removeRow($index) ">删除
+                      </el-button>
+                    </template>
+                  </el-table-column>
+
+                </el-table>
+              </div>
+            </el-scrollbar>
+          </div>
+        </el-form-item>
         <el-row>
           <el-col :span="12" :xs="24">
             <el-form-item label="品牌" prop="brandId">
-              <BrandDataListDialog v-model="formData.brandId"  placeholder="请选择品牌" clearable />
+              <BrandDataListDialog v-model="formData.brandId" placeholder="请选择品牌"/>
             </el-form-item>
           </el-col>
           <el-col :span="12" :xs="24">
             <el-form-item label="产品类型" prop="productTypeId">
-              <ProductTypeDataListDialog v-model="formData.productTypeId"   placeholder="请选择产品类型" />
+              <ProductTypeDataListDialog v-model="formData.productTypeId" placeholder="请选择产品类型"/>
             </el-form-item>
           </el-col>
         </el-row>
@@ -77,7 +130,7 @@
       </el-form>
     </div>
     <template #footer>
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="submitCheck" type="primary" :disabled="formLoading">确 定</el-button>
       <el-button @click="dialogVisible = false">取 消</el-button>
     </template>
   </Dialog>
@@ -86,6 +139,8 @@
 import {ProductInfoApi, ProductInfoVO} from '@/api/oms/productinfo'
 import DraftDesignDataListDialog from "@/components/Dialog/src/DraftDesignDataListDialog/index.vue";
 import BrandDataListDialog from "@/components/Dialog/src/BrandDataListDialog/index.vue";
+import {DICT_TYPE, getStrDictOptions} from "@/utils/dict";
+
 /** 产品资料  表单 */
 defineOptions({name: 'ProductInfoForm'})
 
@@ -102,21 +157,52 @@ const formData = ref({
   code: undefined,
   name: undefined,
   cover: undefined,
-  brandId: undefined,
-  productTypeId: undefined,
+  brandId: '',
+  productTypeId: '',
   draftDesignDataId: undefined,
   enabled: true,
   remark: undefined,
   details: undefined,
 })
+const that = reactive({
+  draftDesignList: [{
+    label: '',
+    id: ''
+  }]
+})
+const addRow = () => {
+  that.draftDesignList.push({
+    label: '',
+    id: ''
+  })
+}
+const removeRow = (index) => {
+  if (that.draftDesignList.length > 1) {
+    that.draftDesignList.splice(index, 1)
+  } else {
+    message.error('至少需要一个')
+  }
+}
+const duplicateCheck = (id: string) => {
+  let count = 0;
+  for (let i = 0; i < that.draftDesignList.length; i++) {
+    if (that.draftDesignList[i].id === id) {
+      count++;
+    }
+  }
+  return count > 1;
+}
 const formRules = reactive({
   name: [{required: true, message: '产品名称不能为空', trigger: 'blur'}],
+  brandId: [{required: true, message: '产品类型选择品牌', trigger: 'blur'}],
+  productTypeId: [{required: true, message: '请选择产品类型', trigger: 'blur'}],
 })
 const formRef = ref() // 表单 Ref
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
+  type = type ? type : 'create'
   dialogTitle.value = t('action.' + type)
   formType.value = type
   resetForm()
@@ -125,6 +211,7 @@ const open = async (type: string, id?: number) => {
     formLoading.value = true
     try {
       formData.value = await ProductInfoApi.getProductInfo(id)
+      that.draftDesignList = JSON.parse(formData.value.draftDesignList || '[]')
     } finally {
       formLoading.value = false
     }
@@ -134,13 +221,52 @@ defineExpose({open}) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+
+const submitCheck = () => {
+  formRef.value.validate().then(() => {
+    submitForm()
+  }).catch(() => {
+    message.error('请完善表单信息')
+  })
+}
+
 const submitForm = async () => {
-  // 校验表单
-  await formRef.value.validate()
+
   // 提交请求
   formLoading.value = true
   try {
+    if (that.draftDesignList.length === 0) {
+      message.error('请选择关联的设计稿')
+      return;
+    }
+    console.log("that.draftDesignList", that.draftDesignList)
+    // 校验关联设计稿
+    let countInfo = {};
+    let ids = [];
+    for (let i = 0; i < that.draftDesignList.length; i++) {
+      const id = that.draftDesignList[i].id
+      const l = that.draftDesignList[i].label
+      if (!id) {
+        message.error(`第${i + 1}行设计稿不能为空`)
+        return;
+      }
+      if (!l) {
+        message.error(`第${i + 1}行风格名称不能为空`)
+        return;
+      }
+      const key = `${id}_${l}`
+      if (countInfo[key]) {
+        message.error(`${l} 行重复`)
+        return;
+      }
+      countInfo[key] = 1;
+      ids.push(id);
+    }
+
     const data = formData.value as unknown as ProductInfoVO
+    data.draftDesignList = JSON.stringify(that.draftDesignList)
+    // 作为默认的设计稿
+    data.draftDesignDataId = ids[0];
     if (formType.value === 'create') {
       await ProductInfoApi.createProductInfo(data)
       message.success(t('common.createSuccess'))
@@ -163,8 +289,8 @@ const resetForm = () => {
     code: undefined,
     name: undefined,
     cover: undefined,
-    brandId: undefined,
-    productTypeId: undefined,
+    brandId: '',
+    productTypeId: '',
     draftDesignDataId: undefined,
     enabled: true,
     remark: undefined,
@@ -173,3 +299,9 @@ const resetForm = () => {
   formRef.value?.resetFields()
 }
 </script>
+
+<style scoped lang="scss">
+.duplicate-tips {
+  box-shadow: 2px 0 0 2px rgba(255, 0, 0, 0.85);;
+}
+</style>

hangtag-ui/hangtag-ui-admin/src/views/system/codingrules/CodingRulesForm.vue

@@ -31,8 +31,10 @@
               <div v-for="c in that.testCodeList" :key="c">
                 {{ c }}
               </div>
-              <el-button v-if="that.testCodeList.length > 0" @click="that.testCodeList = []"
-                         type="primary">清空预览
+              <el-button
+                v-if="that.testCodeList.length > 0"
+                @click="that.testCodeList = []"
+                type="primary">清空预览
               </el-button>
             </div>
           </div>

hangtag-ui/hangtag-ui-admin/src/views/system/codingrules/components/edit-item.vue

@@ -30,8 +30,11 @@
               v-model="that.modelData.value" @change="changInput"
               :placeholder="'请输入'+showText"/>
 
-            <el-input v-else v-model="that.modelData.value" @change="changInput"
-                      :placeholder="'请输入'+showText"/>
+            <el-input
+              v-else
+              v-model="that.modelData.value"
+              @change="changInput"
+              :placeholder="'请输入'+showText"/>
 
           </div>
         </el-form-item>

hangtag-ui/hangtag-ui-front/src/api/oms/productcareitem/index.ts

@@ -1,47 +1,50 @@
-import request from '@/config/axios'
-
-// 产品保养项  VO
-export interface ProductCareItemVO {
-  id: number // id
-  value: string // 说明
-  iconUrl: string // icon图标
-  brandIds: string // 品牌
-  isCombo: boolean // 只作用于组合
-  isAll: boolean // 品牌通用
-  locale: string // 语言标识 字典-language_locale
-  enabled: boolean // 启用状态
-  remark: string // 备注
-}
-
-// 产品保养项  API
-export const ProductCareItemApi = {
-  // 查询产品保养项 分页
-  getProductCareItemPage: async (params: any) => {
-    return await request.get({ url: `/oms/product-care-item/page`, params })
-  },
-
-  // 查询产品保养项 详情
-  getProductCareItem: async (id: number) => {
-    return await request.get({ url: `/oms/product-care-item/get?id=` + id })
-  },
-
-  // 新增产品保养项 
-  createProductCareItem: async (data: ProductCareItemVO) => {
-    return await request.post({ url: `/oms/product-care-item/create`, data })
-  },
-
-  // 修改产品保养项 
-  updateProductCareItem: async (data: ProductCareItemVO) => {
-    return await request.put({ url: `/oms/product-care-item/update`, data })
-  },
-
-  // 删除产品保养项 
-  deleteProductCareItem: async (id: number) => {
-    return await request.delete({ url: `/oms/product-care-item/delete?id=` + id })
-  },
-
-  // 导出产品保养项  Excel
-  exportProductCareItem: async (params) => {
-    return await request.download({ url: `/oms/product-care-item/export-excel`, params })
-  },
-}
+import request from '@/config/axios'
+
+// 产品保养项  VO
+export interface ProductCareItemVO {
+  id: number // id
+  value: string // 说明
+  iconUrl: string // icon图标
+  brandIds: string // 品牌
+  isCombo: boolean // 只作用于组合
+  isAll: boolean // 品牌通用
+  locale: string // 语言标识 字典-language_locale
+  enabled: boolean // 启用状态
+  remark: string // 备注
+}
+
+// 产品保养项  API
+export const ProductCareItemApi = {
+  // 查询产品保养项 分页
+  getProductCareItemPage: async (params: any) => {
+    return await request.get({ url: `/oms/product-care-item/page`, params })
+  },
+  queryList: async (params: any) => {
+    return await request.get({ url: `/oms/product-care-item/list`, params })
+  },
+
+  // 查询产品保养项 详情
+  getProductCareItem: async (id: number) => {
+    return await request.get({ url: `/oms/product-care-item/get?id=` + id })
+  },
+
+  // 新增产品保养项 
+  createProductCareItem: async (data: ProductCareItemVO) => {
+    return await request.post({ url: `/oms/product-care-item/create`, data })
+  },
+
+  // 修改产品保养项 
+  updateProductCareItem: async (data: ProductCareItemVO) => {
+    return await request.put({ url: `/oms/product-care-item/update`, data })
+  },
+
+  // 删除产品保养项 
+  deleteProductCareItem: async (id: number) => {
+    return await request.delete({ url: `/oms/product-care-item/delete?id=` + id })
+  },
+
+  // 导出产品保养项  Excel
+  exportProductCareItem: async (params) => {
+    return await request.download({ url: `/oms/product-care-item/export-excel`, params })
+  },
+}

hangtag-ui/hangtag-ui-front/src/api/oms/productinfo/index.ts

@@ -1,47 +1,49 @@
-import request from '@/config/axios'
-
-// 产品资料  VO
-export interface ProductInfoVO {
-  id: number // id
-  code: string // 产品编码
-  name: string // 产品名称
-  brandId: number // 品牌
-  productTypeId: number // 产品类型id
-  enabled: boolean // 启用状态
-  remark: string // 备注
-  details: string // 详情介绍
-  cover: string // 封面
-}
-
-// 产品资料  API
-export const ProductInfoApi = {
-  // 查询产品资料 分页
-  getProductInfoPage: async (params: any) => {
-    return await request.get({ url: `/oms/product-info/page`, params })
-  },
-
-  // 查询产品资料 详情
-  getProductInfo: async (id: number) => {
-    return await request.get({ url: `/oms/product-info/get?id=` + id })
-  },
-
-  // 新增产品资料 
-  createProductInfo: async (data: ProductInfoVO) => {
-    return await request.post({ url: `/oms/product-info/create`, data })
-  },
-
-  // 修改产品资料 
-  updateProductInfo: async (data: ProductInfoVO) => {
-    return await request.put({ url: `/oms/product-info/update`, data })
-  },
-
-  // 删除产品资料 
-  deleteProductInfo: async (id: number) => {
-    return await request.delete({ url: `/oms/product-info/delete?id=` + id })
-  },
-
-  // 导出产品资料  Excel
-  exportProductInfo: async (params) => {
-    return await request.download({ url: `/oms/product-info/export-excel`, params })
-  },
-}
+import request from '@/config/axios'
+
+// 产品资料  VO
+export interface ProductInfoVO {
+  id: number // id
+  code: string // 产品编码
+  name: string // 产品名称
+  brandId: number // 品牌
+  productTypeId: number // 产品类型id
+  enabled: boolean // 启用状态
+  remark: string // 备注
+  details: string // 详情介绍
+  cover: string // 封面
+  draftDesignList: string, // 设计稿列表
+  draftDesignDataId: string // 设计稿数据id
+}
+
+// 产品资料  API
+export const ProductInfoApi = {
+  // 查询产品资料 分页
+  getProductInfoPage: async (params: any) => {
+    return await request.get({ url: `/oms/product-info/page`, params })
+  },
+
+  // 查询产品资料 详情
+  getProductInfo: async (id: number) => {
+    return await request.get({ url: `/oms/product-info/get?id=` + id })
+  },
+
+  // 新增产品资料 
+  createProductInfo: async (data: ProductInfoVO) => {
+    return await request.post({ url: `/oms/product-info/create`, data })
+  },
+
+  // 修改产品资料 
+  updateProductInfo: async (data: ProductInfoVO) => {
+    return await request.put({ url: `/oms/product-info/update`, data })
+  },
+
+  // 删除产品资料 
+  deleteProductInfo: async (id: number) => {
+    return await request.delete({ url: `/oms/product-info/delete?id=` + id })
+  },
+
+  // 导出产品资料  Excel
+  exportProductInfo: async (params) => {
+    return await request.download({ url: `/oms/product-info/export-excel`, params })
+  },
+}

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/BrandDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled" ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
 
     <template #footer>

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/BrandDataListDialog/config.data.ts

@@ -68,6 +68,7 @@ const crudSchemas = reactive<CrudSchema[]>([
     dictClass: 'string',
     search: {
       show: true,
+
     },
     form: {
       component: 'SelectV2'

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/BrandDataListDialog/index.vue

@@ -1,6 +1,7 @@
 <template>
   <slot>
     <div>
+
       <el-input
         v-model="that.showValue"
         clearable
@@ -16,10 +17,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -107,7 +109,7 @@ const dialogTitle = ref('设计稿件') // 弹窗的标题
 
 const props = defineProps({
   modelValue: {
-    type: [String],
+    type: String,
     required: true
   },
   dataKey: {
@@ -162,13 +164,18 @@ const viewDetails = () => {
   } else {
     openDialog();
   }
-  console.log("viewDetails", viewDetails)
 }
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
@@ -206,7 +213,6 @@ const initInput = async () => {
 }
 watch(() => props.visible, (newVal) => {
   that.visible = newVal;
-
 })
 const clearData = () => {
   that.inputVal = '';
@@ -233,8 +239,18 @@ const updateValue = () => {
 const selectionChange = (row) => {
   if (row && row.length > 0) {
     if (props.multiple) {
-      that.inputVal = row.map(item => item[props.dataKey || 'id']).join(',')
-      that.showValue = row.map(item => item[props.showKey || 'id']).join(',')
+      let valArr = [];
+      let showArr = [];
+      for (let i = 0; i < row.length; i++) {
+        const tmp =  row[i][props.dataKey || 'id']
+        if(valArr.includes(tmp)){
+          continue;
+        }
+        valArr.push( tmp)
+        showArr.push(row[i][props.showKey || 'id'])
+      }
+      that.inputVal = valArr.join(',')
+      that.showValue = showArr.join(',')
     } else {
       if (row.length > 1) {
         useMessage().warning('单选数据，已忽略其他')

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/Dialog.vue

@@ -26,7 +26,7 @@ const getBindValue = computed(() => {
   return obj
 })
 
-const isFullscreen = ref(false)
+const isFullscreen = ref(props.fullscreen)
 
 const toggleFull = () => {
   isFullscreen.value = !unref(isFullscreen)

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/DraftDesignDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled"  ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" >
     <template #enabled="form">
       <el-radio-group v-model="form['enabled']">

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/DraftDesignDataListDialog/config.data.ts

@@ -48,6 +48,7 @@ const crudSchemas = reactive<CrudSchema[]>([
     dictClass: 'string',
     search: {
       show: true,
+
     },
     form: {
       component: 'SelectV2'

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/DraftDesignDataListDialog/index.vue

@@ -1,6 +1,7 @@
 <template>
   <slot>
     <div>
+
       <el-input
         v-model="that.showValue"
         clearable
@@ -17,10 +18,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -165,13 +167,20 @@ const viewDetails = () => {
   }
   console.log("viewDetails", viewDetails)
 }
-
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
+
+
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
     return `${data}`
@@ -228,10 +237,12 @@ const submit = () => {
   updateVisible(false)
 }
 const updateValue = () => {
+  console.log("that.inputVal",that.inputVal)
   emit("update:modelValue", that.inputVal)
 }
 //
 const selectionChange = (row) => {
+  console.log("row",row)
   if (row && row.length > 0) {
     if (props.multiple) {
       that.inputVal = row.map(item => item[props.dataKey || 'id']).join(',')

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/ProductTypeDataListDialog/DataForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle"   append-to-body v-model="dialogVisible">
     <Form :disabled="disabled" ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
 
     <template #footer>

hangtag-ui/hangtag-ui-front/src/components/Dialog/src/ProductTypeDataListDialog/index.vue

@@ -16,10 +16,11 @@
       </el-input>
     </div>
   </slot>
-
+  {{tmp}}
   <Dialog
     :title="dialogTitle"
     width="80%"
+    append-to-body
     v-model="that.visible"
     @close="updateVisible(false)">
     <div>
@@ -165,12 +166,19 @@ const viewDetails = () => {
   }
   console.log("viewDetails", viewDetails)
 }
-watch(() => props.modelValue, (newVal) => {
-  that.inputVal = toStr(newVal);
-  if (that.inputVal) {
-    initInput();
-  }
+// 用监听属性变化无其他意义
+const tmp = computed(()=>{
+  setTimeout(()=>{
+    that.inputVal = toStr(props.modelValue,that.inputVal)
+    if (that.inputVal) {
+      initInput();
+    }
+  },100)
+  return ''
+},{
+  deep: true
 })
+
 const toStr = (data: any) => {
   if (data !== null && data !== undefined) {
     return `${data}`

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/DesignPreviewDialog.vue

@@ -3,12 +3,19 @@
     v-model="that.previewVisible"
     title="预览"
     width="80vw"
-    top="20px"
+    top="2%"
+    :fullscreen="true"
     append-to-body
     @close="updateVisible(false)">
     <div v-loading="that.loading">
       <DesignPropEdit  ref="designPropEditRef" />
     </div>
+    <template #footer>
+        <span class="dialog-footer">
+        <el-button @click="updateVisible(false)">取 消</el-button>
+        <el-button type="primary" @click="submit">确 定</el-button>
+      </span>
+    </template>
   </Dialog>
 </template>
 
@@ -53,6 +60,11 @@ const previewByDraftDesignId = (id: string | number,prop={})=>{
     that.loading = false;
   },300)
 }
+const submit = ()=>{
+ const res = designPropEditRef.value.getPropInfo()
+  console.log("@@",res)
+  updateVisible(false)
+}
 defineExpose({
   preview,
   previewByProductId,

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/DesignPropEdit.vue

@@ -22,75 +22,67 @@
       </el-select>
       <el-button @click="that.currentZoom += 1" :disabled="that.currentZoom >= 30">+
       </el-button>
-    </div>
-    <div style="display: flex; flex-wrap: wrap;">
+      <el-checkbox style="margin: 8px" v-model="that.reView">实时预览</el-checkbox>
+      <el-button
+        v-show="!that.reView"
+        style="margin: 8px"
+        type="primary"
+        size="small"
+        @click="updateDesign">
+        <span>更新</span>
+        <span
+          style="color: #ff0000;font-size: 20px; padding-left: 4px">{{
+            that.changeCount > 0 ? '*' : ''
+          }}</span>
+      </el-button>
 
+    </div>
+    <div v-if="that.sizeInfo" style="margin-left: 60px" :title="`${that.sizeInfo.width}mm`">
+      <span>
+        宽:{{ that.sizeInfo.width }}mm
+      </span>
+    </div>
+    <div
+      style="display: flex;">
+      <div v-if="that.sizeInfo" :title="`${that.sizeInfo.height}mm`">
+      <span class="vertical-text">
+        高{{ that.sizeInfo.height }}
+      </span>
+        <span>mm</span>
+      </div>
       <div v-if="that.previewUrl" style="margin: 2px; box-shadow: 0 0 1px 1px rgb(0,255,0)">
         <el-image
+          :title="showImgTitle"
           @click="imagePreview(that.previewUrl)"
           v-loading="loading"
           :src="that.previewUrl"/>
       </div>
-      <div v-if="that.propOrderByList && that.propOrderByList.length > 0">
+
+      <div style="width: 100%" v-if="that.propOrderByList && that.propOrderByList.length > 0">
         <el-scrollbar height="600px">
-          <el-form label-width="280px">
+          <el-form label-width="180px">
+            <el-form-item label="风格主题" v-show="that.draftDesignList.length > 1">
+              <div class="flex ml-3">
+                <div style="margin-right: 8px">主题风格:</div>
+                <div>
+                  <el-select class="min-w-100" v-model="that.draftDesignId" @change="changeType">
+                    <el-option
+                      v-for="(item) in that.draftDesignList"
+                      :key="item.id"
+                      :label="item.label"
+                      :value="item.id"
+                    />
+                  </el-select>
+                </div>
+              </div>
+            </el-form-item>
+
             <el-form-item
               v-for="(tmp) in  that.propOrderByList"
               :key="tmp.key"
               :label="getLabelName(that.propInfo[tmp.key])">
-              <div v-if="that.propInfo[tmp.key].shape === ShapeType.vueTextCell">
+              <div v-if="!that.propInfo[tmp.key].isCombo">
                 <div
-                  v-if="that.propInfo[tmp.key].isCombo && that.propInfo[tmp.key].dataInfo.length === 2">
-                  <!--               图片文本 组合-->
-                  <div style="display: flex">
-
-                    <div style="display: flex;align-items: center;">
-                      <div>
-                        <i
-                          v-if="that.propInfo[tmp.key].canInput"
-                          class="icon-lk_edit"
-                          style="font-size: 20px"> </i>
-                        <i v-else class="icon-lk_cell_add" style="font-size: 20px"> </i>
-                      </div>
-                      <el-select-v2
-                        v-model="that.propInfo[tmp.key].dataInfo[0].label"
-                        filterable
-                        :options="that.washingInfoList"
-                        placeholder="Please select"
-                        @change="changeComboData(that.propInfo[tmp.key],that.propInfo[tmp.key].dataInfo[0].label)"
-                        size="large"
-                        style="min-width: 280px;width: 100%"
-                      >
-                        <template #default="{ item }">
-                          <div style="display: flex;">
-                            <img :src="item.url" width="30px" height="30px"/>
-                            <span>
-                                {{ item.label }}
-                              </span>
-                          </div>
-                        </template>
-                      </el-select-v2>
-                    </div>
-                    <div class="img-box">
-                      <div>
-                        <img
-                          :src="that.propInfo[tmp.key].dataInfo[1].url"
-                          width="60px"
-                          height="60px"/>
-                      </div>
-                    </div>
-                    <div>
-                      <el-button
-                        v-if="that.propInfo[tmp.key].canChange"
-                        @click="deleteList(info,-1)">
-                        <i class="icon-lk_delete"> </i>
-                      </el-button>
-                    </div>
-                  </div>
-                </div>
-
-                <div
-                  v-else
                   v-for="(text,index) in that.propInfo[tmp.key].dataInfo"
                   :key="index"
                   style="padding: 4px">
@@ -115,25 +107,45 @@
 
                     <el-select-v2
                       v-else
-                      v-model="that.propInfo[tmp.key].dataInfo[index].label"
+                      v-model="that.propInfo[tmp.key].dataInfo[index].showLabel"
                       filterable
-                      :options="that.ingredientInfoList"
+                      :options="getIngredientInfoListByType(that.propInfo[tmp.key].groupType)"
                       placeholder="Please select"
-                      @change="changeData"
+                      @change="changeData(index,tmp.key)"
                       size="large"
                       style="min-width: 280px;width: 100%"
                     />
+                    <div v-if="that.propInfo[tmp.key].groupType === '1'">
 
-
+                      <div
+                        style="display: flex;align-items: center; margin-left: 10px; width: 220px">
+                        <el-row>
+                          <el-col span="4">
+                            <div>占比</div>
+                          </el-col>
+                          <el-col span="14">
+                            <el-input-number
+                              :min="-1" :max="100"
+                              v-model="that.propInfo[tmp.key].dataInfo[index].ratio"
+                              @change="changeData(index,tmp.key)"
+                            />
+                          </el-col>
+                          <el-col span="4">
+                            <div> %</div>
+                          </el-col>
+                        </el-row>
+                      </div>
+                    </div>
                     <el-button
                       v-if="that.propInfo[tmp.key].canChange"
-                      @click="deleteList(info,index)">
+                      @click="deleteList(that.propInfo[tmp.key],index)">
                       <i class="icon-lk_delete"> </i>
                     </el-button>
                   </div>
                 </div>
 
-                <el-button v-if="that.propInfo[tmp.key].canChange" @click="appendList(info)">
+                <el-button v-if="that.propInfo[tmp.key].canChange"
+                           @click="appendList(that.propInfo[tmp.key])">
                   添加
                 </el-button>
               </div>
@@ -142,19 +154,39 @@
                 <div
                   v-for="(img,index) in that.propInfo[tmp.key].dataInfo"
                   :key="index" style="display: flex">
-                  <div class="img-box">
-                    <div>
+                  <div class="img-box" v-if="img.url">
+                    <div style="display: flex">
                       <img :src="img.url" width="60px" height="60px"/>
+                      <el-select-v2
+                        v-model="that.propInfo[tmp.key].dataInfo[0].showLabel"
+                        filterable
+                        :options="washingInfoListByType(that.propInfo[tmp.key].groupType)"
+                        placeholder="Please select"
+                        @change="changeComboData(that.propInfo[tmp.key],that.propInfo[tmp.key].dataInfo[0].showLabel)"
+                        size="large"
+                        style="min-width: 280px;width: 100%"
+                      >
+                        <template #default="{ item }">
+                          <div style="display: flex;">
+                            <img :src="item.url" width="30px" height="30px"/>
+                            <span>
+                                {{ item.label }}
+                              </span>
+                          </div>
+                        </template>
+                      </el-select-v2>
                     </div>
                   </div>
-                  <el-button>
-                    <i class="icon-lk_image"></i>
-                  </el-button>
-                  <el-button @click="deleteList(info,index)">
+                  <div v-else-if="img.label">
+                    <el-input v-model="img.label" disabled/>
+                  </div>
+                  <el-button v-if="that.propInfo[tmp.key].canChange"
+                             @click="deleteList(that.propInfo[tmp.key],index)">
                     <i class="icon-lk_delete"> </i>
                   </el-button>
                 </div>
-                <el-button @click="appendList(info)">
+                <el-button v-if="that.propInfo[tmp.key].canChange"
+                           @click="appendList(that.propInfo[tmp.key])">
                   添加
                 </el-button>
 
@@ -163,7 +195,6 @@
             </el-form-item>
           </el-form>
         </el-scrollbar>
-
       </div>
     </div>
 
@@ -187,13 +218,16 @@ import {replaceDomain} from "@/utils";
 import * as FileApi from "@/api/infra/file";
 import {useLocaleStore} from "@/store/modules/locale";
 import {ProductInfoApi} from "@/api/oms/productinfo";
+
 // 动态属性配置
 const localeStore = useLocaleStore()
 const emit = defineEmits(['change'])
 const draftDesignEditRef = ref()
 const that = reactive({
   propInfo: {
-    groupName: '', // 父节点名称
+    reView: true,
+    groupName: '', // 节点名称
+    groupType: '1', //
     isCombo: false, // 是否是组合节点
     minSize: 1,
     maxSize: 100,
@@ -205,9 +239,14 @@ const that = reactive({
     shape: '', // 图形类型
   },
   propOrderByList: [],
+  draftDesignList: [],
+  draftDesignId: '',
   currentZoom: 6,
+  changeCount: 0,
   previewUrl: "",
   ingredientInfoList: [],
+  sizeInfo: null,
+  brandId: null,
   washingInfoList: [],
   pageConfig: {
     background: null,
@@ -215,7 +254,11 @@ const that = reactive({
   data: {},
   show: false,
 })
-
+const showImgTitle = computed(() => {
+  if (that.sizeInfo) {
+    return '宽:' + that.sizeInfo.width + 'mm  高:' + that.sizeInfo.height + 'mm'
+  }
+})
 const zoomList = [
   {
     value: 1,
@@ -268,21 +311,59 @@ const getLabelName = (item) => {
   return item.groupName + ":"
 }
 const loading = ref(false);
-const changeData = () => {
-  console.log("that.propInfo", that.propInfo)
-  resetData();
-}
-const changeComboData = (item: any, label: string) => {
-  for (let i = 0; i < that.washingInfoList.length; i++) {
-    // @ts-ignore
-    if (that.washingInfoList[i].value === label) {
-      // @ts-ignore
-      item.dataInfo[1].url = that.washingInfoList[i].url
+const changeData = (index, key) => {
+  const info = that.propInfo[key];
+  const infoList = getIngredientInfoListByType(info.groupType)
+  for (let i = 0; i < infoList.length; i++) {
+    if (infoList[i].value === infoList[i].label) {
+      console.log("infoList[i]", infoList[i])
+      const arr = infoList[i].langMapping as Array<any>;
+      let value = '';
+      if (infoList[i].isCombo) {
+        for (let j = 0; j < arr.length; j++) {
+          if (j > 0) {
+            value += arr[j].linkChar || ''
+          }
+          let str = that.propInfo[key].dataInfo[index].ratio;
+          if (str === null || str === undefined || str === -1) {
+            str = ''
+          }
+          value += `${arr[j].value}`.replaceAll('${r}', str)
+        }
+      }
+
+      that.propInfo[key].dataInfo[index].label = value;
       break;
     }
   }
   resetData();
 }
+const changeComboData = (item: any, label: string) => {
+  let info = [];
+  for (let i = 0; i < that.washingInfoList.length; i++) {
+    // @ts-ignore
+    if (that.washingInfoList[i].value === label) {
+      // @ts-ignore
+      item.dataInfo[0].url = that.washingInfoList[i].url
+      info = that.washingInfoList[i].langMapping
+      break;
+    }
+  }
+  for (let i = 0; i < info.length; i++) {
+    if (i + 1 >= item.dataInfo.length) {
+      break;
+    }
+    item.dataInfo[i + 1].label = info[i].value
+  }
+  resetData();
+}
+
+const washingInfoListByType = (type) => {
+  return that.washingInfoList.filter(item => item.type === type)
+}
+const getIngredientInfoListByType = (type) => {
+  return that.ingredientInfoList.filter(item => item.type === type)
+}
 
 const deleteList = (item, index) => {
   item.dataInfo.splice(index, 1)
@@ -293,6 +374,7 @@ const appendList = (item) => {
     {
       label: '',
       url: '',
+      ratio: 0,
       ...item.dataInfo[item.dataInfo.length - 1]
     }
   )
@@ -313,11 +395,13 @@ const formData = ref({
 // 预览 图稿id
 const previewByDraftDesignId = async (id: string | number, propData = {}) => {
   if (id) {
+    that.draftDesignId = +id;
     const res = await DraftDesignDataApi.getDraftDesignData(id)
     if (res) {
       formData.value = res
       const j = formData.value.details || "{}"
       const d = JSON.parse(j)
+      console.log("propData", propData)
       loadConfig(d, propData);
     } else {
       useMessage().error('获取数据不存在:' + id)
@@ -325,29 +409,27 @@ const previewByDraftDesignId = async (id: string | number, propData = {}) => {
   }
 }
 // 预览 根据商品id
-const previewByProductId = async (id: string | number, propData = {}) => {
+const previewByProductId = async (id: string | number, propData = {}, defDraftDesignId = null) => {
   if (id) {
     const prodRes = await ProductInfoApi.getProductInfo(id)
     if (!prodRes.draftDesignDataId) {
       useMessage().error('商品未关联设计图稿数据:' + id)
       return;
     }
-    const res = await DraftDesignDataApi.getDraftDesignData(prodRes.draftDesignDataId)
-    if (res) {
-      formData.value = res
-      const j = formData.value.details || "{}"
-      const d = JSON.parse(j)
-      loadConfig(d, propData);
-    } else {
-      useMessage().error('获取数据不存在:' + id)
-    }
+    that.brandId = prodRes.brandId
+    console.log("prodRes", prodRes)
+    that.draftDesignList = JSON.parse(prodRes.draftDesignList, '[]')
+    that.draftDesignId = defDraftDesignId || prodRes.draftDesignDataId
+    await previewByDraftDesignId(that.draftDesignId, propData)
   }
 }
 const loadConfig = (config: object, propData = {}) => {
-  console.log("config", config)
+
   that.pageConfig = config.pageConfig
   that.data = config.data
-  that.propInfo = propData
+  that.propInfo = {...propData}
+
+  that.sizeInfo = that.pageConfig.editArea
   // true, conf.pageConfig, conf.data, test
   draftDesignEditRef.value.init(false, that.pageConfig, that.data, that.propInfo)
   showPng();
@@ -355,12 +437,14 @@ const loadConfig = (config: object, propData = {}) => {
 }
 const queryUseLabel = (label) => {
   FileApi.getDomain().then(domain => {
-    ProductCareItemApi.getProductCareItemPage({
+    ProductCareItemApi.queryList({
       pageNo: 1,
       pageSize: 100,
       value: label,
+      type: '1,3,4,5',
+      brandIds: that.brandId,
+      isAll: true,
       locale: currentLocale.value.lang,
-      isCombo: false,
     }).then((data) => {
       that.ingredientInfoList = [];
       if (data.list) {
@@ -368,17 +452,22 @@ const queryUseLabel = (label) => {
           return {
             value: item.value,
             label: item.value,
+            type: item.type,
+            isCombo: item.isCombo,
+            langMapping: JSON.parse(item.langMapping || '{}'),
             url: ''
           }
         })
       }
     })
-    ProductCareItemApi.getProductCareItemPage({
+    ProductCareItemApi.queryList({
       pageNo: 1,
       pageSize: 100,
       value: label,
+      brandIds: that.brandId,
+      isAll: true,
       locale: currentLocale.value.lang,
-      isCombo: true,
+      type: '2'
     }).then((data) => {
       that.washingInfoList = [];
       if (data.list) {
@@ -386,6 +475,9 @@ const queryUseLabel = (label) => {
           return {
             value: item.value,
             label: item.value,
+            type: item.type,
+            isCombo: item.isCombo,
+            langMapping: JSON.parse(item.langMapping || '{}'),
             url: replaceDomain(domain, item.iconUrl)
           }
         })
@@ -401,10 +493,15 @@ const showPng = () => {
       draftDesignEditRef.value.toPngUrl((url) => {
         that.previewUrl = url
         const info = draftDesignEditRef.value.getPropInfo();
-        console.log("info", info)
-        that.propInfo = info.propDefault;
+
+        that.propInfo = {
+          ...info.propDefault,
+          ...that.propInfo || {}
+        };
         that.propOrderByList = info.propOrderByList;
-        submit();
+        setTimeout(() => {
+          submit();
+        }, 300)
         loading.value = false;
       }, {
         widthScale: that.currentZoom,
@@ -416,18 +513,34 @@ const showPng = () => {
 
 }
 const resetData = () => {
+  if (that.reView) {
+    updateDesign();
+  } else {
+    that.changeCount++;
+  }
+}
+const updateDesign = () => {
+  that.changeCount = 0;
   setTimeout(() => {
     draftDesignEditRef.value.init(false, that.pageConfig, that.data, that.propInfo)
     showPng();
   }, 100)
 }
-
+const changeType = () => {
+  previewByDraftDesignId(that.draftDesignId, that.propInfo)
+}
 const getPropInfo = () => {
-  return that.propInfo;
+  return {
+    draftDesignData: draftDesignEditRef.value.getJson(),
+    // 设计稿id
+    draftDesignId: that.draftDesignId,
+    propInfo: that.propInfo
+  };
 }
 const submit = () => {
   const info = getPropInfo();
   emit('change', info)
+
 }
 onMounted(() => {
 })
@@ -435,11 +548,16 @@ defineExpose({
   previewByDraftDesignId,
   previewByProductId,
   loadConfig,
-  getPropInfo
+  getPropInfo,
 })
 </script>
 
 <style lang="scss" scoped>
+.vertical-text {
+  writing-mode: vertical-rl; /* 垂直排版，从右到左 */
+  text-orientation: upright; /* 保持文字直立 */
+  padding: 6px;
+}
 
 :deep(.el-input__wrapper) {
   position: relative;

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/DynamicPropConfig.vue

@@ -3,10 +3,11 @@
     v-model="that.show"
     title="动态属性配置"
     width="60vw"
+    top="2%"
     draggable
     append-to-body
     @close="updateVisible(false)">
-    <div style="width: 100%">
+    <div style="width: 100%; max-height: 75vh">
       <el-alert
         title="动态属性配置说明"
         type="info"
@@ -29,7 +30,18 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <el-form-item label="控制">
+        <el-form-item label="保养类型" >
+          <el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
+            <el-option
+              v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
+              :key="`${dict.value}`"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+<!--       停用 -->
+        <el-form-item label="控制" v-if="false">
           <el-row>
             <el-col :span="12">
              <div style="width: 120px;display: flex">
@@ -89,7 +101,7 @@
                   <el-col :span="2">{{ index + 1 }}</el-col>
                   <el-col :span="11">
                    <span><span v-if="that.configInfo.isCombo" style="padding-right: 4px">
-                     {{ index === 0 ? 'text' : 'icon' }}
+                     {{index !== 0  ? 'text' : 'icon' }}
                    </span> X向右</span>
                     <el-input-number v-model="that.configInfo.pointList[index].x"/>
                   </el-col>
@@ -98,7 +110,7 @@
                       <span
                         v-if="that.configInfo.isCombo"
                         style="padding-right: 4px">
-                        {{ index === 0 ? 'text' : 'icon' }}
+                        {{ index !== 0 ? 'text' : 'icon' }}
                       </span>
                       Y向下</span>
                     <el-input-number v-model="that.configInfo.pointList[index].y"/>
@@ -125,6 +137,8 @@ import {ElAlert} from "element-plus";
 import {reactive, computed, watch} from 'vue'
 import {calculateVectorDifference} from "@/components/DraftDesign/utils/FuncUtil";
 import {useMessage} from "@/hooks/web/useMessage";
+import {DICT_TYPE, getStrDictOptions} from "@/utils/dict";
+import {ShapeType} from "../config";
 // 动态属性配置
 
 const emit = defineEmits(['update:visible', 'submit'])
@@ -134,6 +148,7 @@ const that = reactive({
   show: false,
   configInfo: {
     groupName: '', // 父节点名称
+    groupType: '1',
     isCombo: false, // 是否是组合节点
     minSize: 1,
     maxSize: 100,
@@ -184,9 +199,10 @@ const append = (count = 1) => {
 }
 const init = (allGroupList, data) => {
   that.allGroupList = allGroupList;
-
+  console.log("data",data)
   that.configInfo = {
     groupName: '', // 父节点名称
+    groupType: '1',
     groupId: `g_${Math.random().toString(36).substring(2)}`,
     isCombo: false, // 是否是组合节点
     minSize: 1, // 节点组最小数量

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/layout/index.vue

@@ -94,7 +94,8 @@
       <template #default>
         <div>
           <span style="font-size: 0.8rem;color: #b5b3b3">将关键必要属性进行排序，让布局更清晰</span>
-          <span style="font-size: 0.8rem;color: #b5b3b3">按下鼠标左键进行拖拽进行排序，拖拽结束后，即可生效。</span>
+          <span
+            style="font-size: 0.8rem;color: #b5b3b3">按下鼠标左键进行拖拽进行排序，拖拽结束后，即可生效。</span>
           <Draggable
             style="display: flex; flex-direction: column; align-items: center;"
             ghost-class="draggable-ghost"
@@ -107,11 +108,14 @@
           >
             <template #item="{ element,index }">
               <div class="order-by-item">
-                <span style="padding: 4px">{{index+1}}</span>
-                <i v-if="element.shape === ShapeType.vueShapeImage" class="icon-lk_image" title="icon属性"> </i>
+                <span style="padding: 4px">{{ index + 1 }}</span>
+                <i
+                  v-if="element.shape === ShapeType.vueShapeImage"
+                  class="icon-lk_image"
+                  title="icon属性"> </i>
                 <i v-else-if="element.isCombo" class="icon-lk_cell_add" title="组合属性"> </i>
                 <i v-else class="icon-lk_text"> </i>
-                <span style="padding: 4px;">{{element.name}}</span>
+                <span style="padding: 4px;">{{ element.name }}</span>
 
               </div>
             </template>
@@ -120,7 +124,7 @@
       </template>
     </el-dialog>
 
-    <el-container >
+    <el-container>
       <el-header class="top-tool-bar" v-show="layout.draftDesignState">
         <div style="display: flex;align-items: center;height: 100%;">
           <div style="background-color: #34bfa3;width: 68px;height: 100%;">
@@ -248,7 +252,7 @@
               <el-button
                 title="清空Clear"
                 @click="btnChange('clearData',true)"
-                >
+              >
                 <i class="icon-lk_delete"></i>
               </el-button>
             </div>
@@ -275,7 +279,7 @@
                 :width="60"
                 :effect="that.effect"
                 trigger="hover"
-                content="lineColor"
+                content="backgroundColor"
               >
                 <template #reference>
                   <ColorPickerTool
@@ -294,7 +298,7 @@
                 :width="60"
                 :effect="that.effect"
                 trigger="hover"
-                content="lineColor"
+                content="FillColor"
               >
                 <template #reference>
                   <div>
@@ -339,6 +343,42 @@
                 </template>
               </el-popover>
             </div>
+            <div v-if="hasKey(that.cellInfo, 'data.style.shape.strokeDasharray')">
+              <el-popover
+                placement="bottom-start"
+                :width="60"
+                :effect="that.effect"
+                trigger="hover"
+                content="示例: 10,5 说明:线条将交替绘制 10 像素长的线段和 5 像素长的间隙，重复这个模式"
+              >
+                <template #reference>
+                  <div>
+                    <el-select
+                      v-model="that.cellInfo.data.style.shape.strokeDasharray"
+                      @change="changeCellInfo(undefined)"
+                      style="width: 120px">
+                      <el-option
+                        v-for="item in strokeDasharrayList" :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                        <template #default>
+                          <div :title="item.value">
+                            <svg width="120" height="20">
+                              <!-- 使用路径绘制一条虚线 -->
+                              <line x1="10" y1="10" x2="190" y2="10"
+                                    stroke="black"
+                                    stroke-width="2"
+                                    :stroke-dasharray="item.value"/>
+                            </svg>
+                          </div>
+                        </template>
+
+                      </el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-popover>
+            </div>
 
             <div v-if="hasKey(that.cellInfo, 'data.style.shape.strokeWidth')">
               <el-popover
@@ -557,6 +597,10 @@
               >
                 <template #default>
                   <div>
+                    <div v-if="hasKey(that.cellInfo, 'data.style.text.overflow')">
+                      <el-checkbox @change="changTextHide" v-model="that.isHidden">超出隐藏
+                      </el-checkbox>
+                    </div>
                     <div style="display: flex;flex-wrap: wrap;margin: auto">
                       <div v-for="btn in alignBtnList" :key="btn.key">
 
@@ -652,11 +696,11 @@
       </el-header>
       <el-container>
         <div v-show="layout.draftDesignState">
-          <DraftDesignLeftPanel  @on-add-node="handlerAddNode"/>
+          <DraftDesignLeftPanel @on-add-node="handlerAddNode"/>
         </div>
 
         <el-container>
-          <el-main class="center-panel" >
+          <el-main class="center-panel">
             <div>
               <slot>
                 <div>main</div>
@@ -665,10 +709,15 @@
             </div>
           </el-main>
           <el-footer class="bottom-tool-bar">
-            <div style="display: flex; align-items: center; height: 100%;justify-content: flex-end;">
+            <div
+              style="display: flex; align-items: center; height: 100%;justify-content: flex-end;">
               <div v-show="layout.draftDesignState">
                 <div>
-                  <el-button :type="layout.rightPanelOpen ? 'primary' : ''"  @click="changeRightPanel"><i class="icon-lk_layer_set" style="font-size: 1.2rem"></i></el-button>
+                  <el-button
+                    :type="layout.rightPanelOpen ? 'primary' : ''"
+                    @click="changeRightPanel">
+                    <i class="icon-lk_layer_set" style="font-size: 1.2rem"></i>
+                  </el-button>
                 </div>
               </div>
               <div>
@@ -696,7 +745,10 @@
 
           </el-footer>
         </el-container>
-        <DraftDesignRightPanel  v-show="layout.draftDesignState"  ref="draftDesignRightPanelRef" @click-item="clickItem" />
+        <DraftDesignRightPanel
+          v-show="layout.draftDesignState"
+          ref="draftDesignRightPanelRef"
+          @click-item="clickItem"/>
       </el-container>
 
     </el-container>
@@ -718,7 +770,7 @@ import {
   ElSelectV2
 } from "element-plus";
 
-import { computed, watch, onMounted} from 'vue'
+import {computed, watch, onMounted} from 'vue'
 import {nextId} from "@/components/DraftDesign/utils/FuncUtil";
 import {useDebounceFn} from '@vueuse/core'
 import Draggable from 'vuedraggable'
@@ -748,7 +800,7 @@ const onClickOutSize = () => {
 }
 
 
-const hasKey = (obj:any, path:string) => {
+const hasKey = (obj: any, path: string) => {
   if (!obj || !path) return null;
   const keys = path.split('.');
   let result = obj;
@@ -763,11 +815,11 @@ const hasKey = (obj:any, path:string) => {
   }
   return false;
 }
-const topBtnClick = (btn:any) => {
+const topBtnClick = (btn: any) => {
   btn.handler();
   changeCellInfo()
 }
-const changePageColor = (val:any, key:string) => {
+const changePageColor = (val: any, key: string) => {
   const split = key.split(".");
   if (split.length === 1) {
     that.pageConfig[split[0]] = val;
@@ -781,7 +833,7 @@ const changePageColor = (val:any, key:string) => {
   changePageConfig()
 }
 
-const changeColor = (val:any, key:string) => {
+const changeColor = (val: any, key: string) => {
   const split = key.split(".");
   if (split.length === 1) {
     that.cellInfo[split[0]] = val;
@@ -794,6 +846,68 @@ const changeColor = (val:any, key:string) => {
   }
   changeCellInfo()
 }
+const strokeDasharrayList = [
+  {
+    value: '5,5',
+    label: '5,5' // 简单的短线虚线
+  },
+  {
+    value: '10,10',
+    label: '10,10' // 均匀的中等虚线
+  },
+  {
+    value: '15,15',
+    label: '15,15' // 长线虚线
+  },
+  {
+    value: '20,20',
+    label: '20,20' // 更长的线段和间隔
+  },
+  {
+    value: '3,5,3',
+    label: '3,5,3' // 细碎的虚线风格
+  },
+  {
+    value: '1,3',
+    label: '1,3' // 细小点线
+  },
+  {
+    value: '4,1,2',
+    label: '4,1,2' // 交替短线和间隙
+  },
+  {
+    value: '8,4,2,4',
+    label: '8,4,2,4' // 变换长度的虚线
+  },
+  {
+    value: '12,3,3,3',
+    label: '12,3,3,3' // 长线与短线组合
+  },
+  {
+    value: '5,10',
+    label: '5,10' // 短线与长间隔
+  },
+  {
+    value: '2,2',
+    label: '2,2' // 短线密集虚线
+  },
+  {
+    value: '7,3,1,3',
+    label: '7,3,1,3' // 多段式虚线
+  },
+  {
+    value: '10,2,5,2',
+    label: '10,2,5,2' // 中长线和短间隔组合
+  },
+  {
+    value: '3,1',
+    label: '3,1' // 极细小的点线风格
+  },
+  {
+    value: '6,4,1,4,1,4',
+    label: '6,4,1,4,1,4' // 复杂的点线组合
+  }
+];
 
 const alignBtnList = computed(() => {
   let arr = [];
@@ -1017,7 +1131,7 @@ const angleList = computed(() => {
   const arr = []
   for (let i = 0; i < 360; i++) {
     //@ts-ignore
-    arr.push({ value: i,  label: `${i}` })
+    arr.push({value: i, label: `${i}`})
   }
   return arr
 })
@@ -1147,7 +1261,8 @@ const that = reactive({
   showDialog: false,
   showOrderByDialog: false,
   sizeMode: '',
-  propList: [ ],
+  propList: [],
+  isHidden: false,
   borderAngle: [0, 0, 0, 0],
   pageConfig: {
     background: {
@@ -1223,6 +1338,13 @@ const defaultSizeChange = (val) => {
     that.showDialog = false
   }
 
+}
+const changTextHide = () => {
+  if (hasKey(that.cellInfo, 'data.style.text.overflow')) {
+    that.cellInfo.data.style.text.overflow = that.isHidden ? 'hidden' : 'visible';
+    changeCellInfo()
+  }
+
 }
 const changePos = (p: 'x' | 'y') => {
   changeCellInfo({
@@ -1233,6 +1355,7 @@ const changeSize = () => {
   changeCellInfo()
 }
 const changeCellInfo = (cellPos = undefined) => {
+  console.log("changeCellInfo",)
   emit('changeCell', that.cellInfo, cellPos)
 }
 const changePageConfig = () => {
@@ -1280,6 +1403,9 @@ onMounted(() => {
 
 const selectedNode = (e) => {
   that.cellInfo = {...e};
+  if (hasKey(that.cellInfo, 'data.style.text.overflow')) {
+    that.isHidden = that.cellInfo.data.style.text.overflow === 'hidden'
+  }
   if (hasKey(that.cellInfo, 'data.style.borderRadius')) {
     if (that.cellInfo.data.style.borderRadius) {
       that.borderAngle = [0, 0, 0, 0]
@@ -1337,28 +1463,29 @@ const updatePageConfig = useDebounceFn((conf) => {
   }
 }, 100)
 
-const changeRightPanel = ()=>{
+const changeRightPanel = () => {
   layout.rightPanelOpen = !layout.rightPanelOpen
   updateCellList();
   draftDesignRightPanelRef.value.toggle(layout.rightPanelOpen)
 }
-const updateCellList = ()=>{
-  if(layout.rightPanelOpen){
+const updateCellList = () => {
+  if (layout.rightPanelOpen) {
     let json = layout.graph.toJSON();
     draftDesignRightPanelRef.value.updateList(json.cells)
   }
 }
-const setGraph = (g)=>{
+const setGraph = (g) => {
   layout.graph = g;
   layout.draftDesignState = getDraftDesignState();
 }
-const clickItem = (item)=>{
+const clickItem = (item) => {
   emit('selectCell', item)
 }
-const updatePropList = (propList: any[])=>{
-  that.propList = propList
+const updatePropList = (propList: any[]) => {
+  console.log(" that.propList", propList)
+  that.propList = [...propList]
 }
-const propListChange=()=>{
+const propListChange = () => {
   console.log("propListChange@@")
   emit('propListChange', that.propList)
 }
@@ -1610,10 +1737,12 @@ $panelZIndex: 10;
   overflow: hidden;
   padding: 0;
 }
-.order-by-item:hover{
+
+.order-by-item:hover {
   cursor: move;
 }
-.order-by-item{
+
+.order-by-item {
   margin: 6px;
   border: 1px solid #8e8b8b;
   width: 100%;

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/DottedLineNode.vue

@@ -0,0 +1,221 @@
+<!-- eslint-disable vue/this-in-template -->
+<template>
+  <div
+    :id="cellInfo.id"
+    class="node-content"
+   :class="{ 'node-content-group' : this.cellInfo.editMode && this.cellInfo.propGroupId }"
+    :title="this.cellInfo.propGroupName"
+    v-reSize="changSize">
+
+    <svg
+      style="position: absolute;
+      width: 100%;height: 100%;
+      top: 50%; left: 50%;
+     transform: translate(-50%, -50%) scale(1); "
+    >
+      <line
+            x1="0"
+            y1="8"
+            :x2="sizeWInfo.width"
+            y2="8"
+            :stroke="cellInfo.style.shape.strokeColor"
+            :stroke-width="cellInfo.style.shape.strokeWidth"
+            :stroke-dasharray="cellInfo.style.shape.strokeDasharray" />
+    </svg>
+  </div>
+</template>
+
+<script lang="ts">
+import {defineComponent} from 'vue'
+import {
+  filterUnsafeHtml,
+  getSafeValue,
+  mergeDeepObject,
+  nextId, objectHasKey
+} from "@/components/DraftDesign/utils/FuncUtil";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+
+
+export default defineComponent({
+  name: 'DottedLineNode',
+  computed: {
+    VueCellShapeType() {
+      return VueCellShapeType
+    },
+    minShapeSize() {
+      if (this.cellInfo.style.shape.strokeWidth) {
+        return this.minSize - this.toInt(this.cellInfo.style.shape.strokeWidth)
+      }
+      return this.minSize;
+    },
+    svgStyle() {
+      return {
+
+      };
+    }
+  },
+  // eslint-disable-next-line vue/order-in-components
+  inject: ['getNode'],
+  // eslint-disable-next-line vue/order-in-components
+  data() {
+    return {
+      cellInfo: {
+        id: '',
+        label: '',
+        showInput: false,
+        shape: VueCellShapeType.Rect,
+        style: {
+
+          shape: {
+            strokeColor: '#000000', // 填充颜色
+            strokeWidth: 2, // 描边宽度
+            strokeDasharray: '5,5', // 虚线模式
+          }
+        }
+      },
+      nodeInfo: {
+        store: {
+          data: {
+            data: {
+              label: ''
+            }
+          }
+        }
+      },
+      fontSize: 12,
+      targetElement: null,
+      minSize: 2,
+      sizeWInfo: {
+        width: 0,
+        height: 0,
+      },
+    }
+  },
+
+  mounted() {
+    const node = (this as any).getNode()
+    this.nodeInfo = node
+
+    if (node && node.data) {
+      this.setCellInfo(node.data)
+    }
+    node.on('change:data', ({current}) => {
+
+      this.setCellInfo(current)
+    })
+
+  },
+  unmounted() {
+  },
+  methods: {
+    toInt(val, defaultVal = 0) {
+      try {
+        return parseInt(val)
+      } catch (e) {
+        return defaultVal
+      }
+    },
+    safeHtml(val) {
+      if (val) {
+        val = val.replace(/[\n\r]/g, "<br/>")
+      }
+      return filterUnsafeHtml(val)
+    },
+    inputBlur() {
+      this.cellInfo.showInput = false
+    },
+    inputChange() {
+      if (this.nodeInfo.store && this.nodeInfo.store.data) {
+        // this.nodeInfo.store.data.data.label = this.cellInfo.label
+        this.nodeInfo.store.data.data = {
+          ...this.nodeInfo.store.data.data,
+          ...this.cellInfo
+        }
+      }
+    },
+    setInput(val: boolean) {
+      // this.cellInfo.showInput = val
+    },
+    changSize(size: any) {
+
+      this.sizeWInfo.width = size.width;
+      this.sizeWInfo.height = size.height;
+      this.minSize = Math.min(size.height, size.width)
+      let s = size.height + 12;
+      if (s > 60) {
+        s = s + s / 3
+      }
+      if (s < 6) {
+        s = 6
+      } else if (s >= 1000) {
+        s = 1000
+      }
+
+      this.fontSize = s;
+      this.changeFontSize();
+    },
+    changeFontSize() {
+      this.cellInfo.style.text.fontSize = `${this.fontSize}px`
+    },
+    setCellInfo(info: any) {
+      if (!info) {
+        info = {
+          style: {
+            text: {}
+          }
+        }
+      }
+      this.cellInfo = mergeDeepObject({
+        showInput: false,
+        id: nextId(),
+        label: '',
+        shape: VueCellShapeType.Rect,
+        style: {
+          shape: {
+            strokeColor: '#000000', // 填充颜色
+            strokeWidth: 2, // 描边宽度
+            strokeDasharray: '5,5', // 虚线模式
+          },
+          text: {}
+        }
+      }, info)
+      console.log("setCellInfo@@", this.cellInfo)
+      this.cellInfo.showInput = false;
+      setTimeout(() => {
+        if (this.nodeInfo.store && this.nodeInfo.store.data) {
+          this.nodeInfo.store.data.data = this.cellInfo
+        }
+      }, 300)
+      // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
+      this.setInput(this.cellInfo.showInput)
+      this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
+      this.changeFontSize();
+    }
+
+  }
+})
+</script>
+
+<style scoped lang="scss">
+.node-content {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  display: flex;
+}
+
+</style>

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/LineCellNode.vue

@@ -21,7 +21,7 @@ import {
   mergeDeepObject,
   nextId
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -158,6 +158,20 @@ export default defineComponent({
       }, 300)
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeCellNode.vue

@@ -120,7 +120,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -392,6 +392,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeCircleNode.vue

@@ -63,7 +63,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -246,6 +246,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeEllipseNode.vue

@@ -64,7 +64,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -254,6 +254,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeFivePointedNode.vue

@@ -66,7 +66,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -262,6 +262,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeImageNode.vue

@@ -40,7 +40,7 @@ import {
   mergeDeepObject,
   nextId,
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 import {convertImageToBase64} from "@/components/DraftDesign/utils/Dpi";
 
 
@@ -267,6 +267,20 @@ export default defineComponent({
         }
       }, 300)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeLozengeNode.vue

@@ -67,7 +67,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -286,6 +286,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }
 

hangtag-ui/hangtag-ui-front/src/components/DraftDesign/components/node/ShapeRectNode.vue

@@ -73,7 +73,7 @@ import {
   mergeDeepObject,
   nextId, objectHasKey
 } from "@/components/DraftDesign/utils/FuncUtil";
-import {getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
+import {configInfo, getDraftDesignState, VueCellShapeType} from "@/components/DraftDesign/config";
 
 
 export default defineComponent({
@@ -265,6 +265,20 @@ export default defineComponent({
       // this.fontSize = parseInt(getSafeValue(this.cellInfo.style.text, 'fontSize') || '14')
       this.setInput(this.cellInfo.showInput)
       this.cellInfo.editMode  = getDraftDesignState();
+      if(this.cellInfo.editMode && this.cellInfo.propGroupId){
+        const showRandomGroupColor = configInfo.LK_SHOW_RANDOM_GROUP_COLOR()
+        if(!showRandomGroupColor){
+          setTimeout(()=>{
+            const [type, id] = this.cellInfo.propGroupId.split("_")
+            if(id){
+              document.getElementById(this.cellInfo.id)?.style.setProperty(
+                "--lk-prop-group-color",
+                `#${id}`
+              );
+            }
+          },100)
+        }
+      }
       this.changeFontSize();
     }