diff --git a/src/components.d.ts b/src/components.d.ts
index 2f2bdb0d..79249e52 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -49,20 +49,15 @@ declare module '@vue/runtime-core' {
     ElPopover: typeof import('element-plus/es')['ElPopover'];
     ElProgress: typeof import('element-plus/es')['ElProgress'];
     ElRadio: typeof import('element-plus/es')['ElRadio'];
-    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'];
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar'];
     ElSelect: typeof import('element-plus/es')['ElSelect'];
-    ElSelectV2: typeof import('element-plus/es')['ElSelectV2'];
     ElSkeleton: typeof import('element-plus/es')['ElSkeleton'];
     ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem'];
     ElSlider: typeof import('element-plus/es')['ElSlider'];
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu'];
     ElSwitch: typeof import('element-plus/es')['ElSwitch'];
-    ElTable: typeof import('element-plus/es')['ElTable'];
-    ElTableColumn: typeof import('element-plus/es')['ElTableColumn'];
     ElTabPane: typeof import('element-plus/es')['ElTabPane'];
     ElTabs: typeof import('element-plus/es')['ElTabs'];
-    ElTag: typeof import('element-plus/es')['ElTag'];
     ElTooltip: typeof import('element-plus/es')['ElTooltip'];
     ElUpload: typeof import('element-plus/es')['ElUpload'];
     Emoji: typeof import('./components/packages/components/emoji/emoji.vue')['default'];
diff --git a/src/views/LegoDesigner/components/RightSetter.vue b/src/views/LegoDesigner/components/RightSetter.vue
index 0b2252f4..c69bb082 100644
--- a/src/views/LegoDesigner/components/RightSetter.vue
+++ b/src/views/LegoDesigner/components/RightSetter.vue
@@ -23,19 +23,30 @@
           </div>
         </el-form>
       </el-tab-pane>
-      <el-tab-pane label="数据" name="second">
+      <el-tab-pane class="data-tab-pane" label="数据" name="second">
         <el-form label-width="80px" label-position="left">
-          <div
-            v-for="(value, key, index) in HJSchemaJsonStore.componentsTree[pageActiveIndex]
-              .children[widgetIndex].dataSource"
-            :key="index"
+          <template
+            v-if="
+              Object.keys(
+                HJSchemaJsonStore.componentsTree[pageActiveIndex].children[widgetIndex].dataSource
+              ).length
+            "
           >
-            <component
-              :is="getDataSetterCom(key)"
-              :id="selectedWidgetId"
-              :page-index="pageActiveIndex"
-              :value="value"
-            ></component>
+            <div
+              v-for="(value, key, index) in HJSchemaJsonStore.componentsTree[pageActiveIndex]
+                .children[widgetIndex].dataSource"
+              :key="index"
+            >
+              <component
+                :is="getDataSetterCom(key)"
+                :id="selectedWidgetId"
+                :page-index="pageActiveIndex"
+                :value="value"
+              ></component>
+            </div>
+          </template>
+          <div v-else class="no-data">
+            <no-data></no-data>
           </div>
         </el-form>
       </el-tab-pane>
@@ -114,7 +125,7 @@
       .el-tabs__content {
         display: flex;
         // justify-content: center;
-        padding: 30px 30px 10px 30px;
+        padding: 30px 20px 10px 20px;
         box-sizing: border-box;
         // height: calc(100vh - 170px);
         overflow: auto;
diff --git a/src/views/LegoDesigner/components/WidgetList/WidgetList.vue b/src/views/LegoDesigner/components/WidgetList/WidgetList.vue
index 3e26ffc1..a59b42de 100644
--- a/src/views/LegoDesigner/components/WidgetList/WidgetList.vue
+++ b/src/views/LegoDesigner/components/WidgetList/WidgetList.vue
@@ -23,6 +23,8 @@
               v-if="item.category === 'icon'"
               :widget-data="itemCom"
             ></lego-design-icon>
+            <!-- 列表 -->
+            <lego-li-list v-else-if="item.category === 'li'" :widget-data="itemCom"></lego-li-list>
             <!-- 普通组件 -->
             <img v-else :src="getAssetsFile(itemCom.screenShot.src)" />
           </div>
@@ -37,8 +39,11 @@
   import { IWidget, IWidgetTab } from '../../types';
   import { getAssetsFile } from '../../utils/common';
   import LegoDesignIcon from '../../widgets/icon/LegoDesignIconList.vue';
+  import LegoLiList from '../../widgets/li/LegoLiList.vue';
   import { useIconfontItem } from '../../widgets/icon/useIconfontItem';
   import { iconfontList } from '../../widgets/icon/iconfont';
+  import { ListStyleTypeList } from '../../widgets/li/liList';
+  import { useLiListItem } from '../../widgets/li/useLiListItem';
 
   const emit = defineEmits(['addWidget']);
 
@@ -71,6 +76,18 @@
     });
   };
   initIconfontList();
+
+  // 初始化列表组件
+  const initLiList = () => {
+    WIDGET_CONFIG_LIST.forEach((cptList) => {
+      if (cptList.category === 'li') {
+        ListStyleTypeList.forEach((listStyleTypeItem) =>
+          cptList.list.push(useLiListItem(listStyleTypeItem))
+        );
+      }
+    });
+  };
+  initLiList();
 </script>
 <style lang="scss" scoped>
   .widget-list-box {
diff --git a/src/views/LegoDesigner/index.vue b/src/views/LegoDesigner/index.vue
index b6fe1848..dafa1d37 100644
--- a/src/views/LegoDesigner/index.vue
+++ b/src/views/LegoDesigner/index.vue
@@ -387,13 +387,13 @@
       setUuid();
     } else if (event.ctrlKey && event.keyCode === 67) {
       // ctrl + c
-      if (selectedWidgetId.value) {
-        contextPageIndex.value = pageActiveIndex.value;
-        contextComIndex.value = HJSchemaJsonStore.value.componentsTree[
-          pageActiveIndex.value
-        ].children.findIndex((item: { id: string }) => item.id === selectedWidgetId.value);
-        copyWidget();
-      }
+      // if (selectedWidgetId.value) {
+      //   contextPageIndex.value = pageActiveIndex.value;
+      //   contextComIndex.value = HJSchemaJsonStore.value.componentsTree[
+      //     pageActiveIndex.value
+      //   ].children.findIndex((item: { id: string }) => item.id === selectedWidgetId.value);
+      //   copyWidget();
+      // }
     }
   };
   // 组件移动
diff --git a/src/views/LegoDesigner/schema/widgetConfig.ts b/src/views/LegoDesigner/schema/widgetConfig.ts
index 17114284..7db7e0b9 100644
--- a/src/views/LegoDesigner/schema/widgetConfig.ts
+++ b/src/views/LegoDesigner/schema/widgetConfig.ts
@@ -644,5 +644,11 @@ export const WIDGET_CONFIG_LIST: Array<IWidgetTab> = [
     category: 'icon',
     dataSource: {},
     list: []
+  },
+  {
+    title: '列表',
+    category: 'li',
+    dataSource: {},
+    list: []
   }
 ];
diff --git a/src/views/LegoDesigner/screenShot/li-1.png b/src/views/LegoDesigner/screenShot/li-1.png
new file mode 100644
index 00000000..d656a29a
Binary files /dev/null and b/src/views/LegoDesigner/screenShot/li-1.png differ
diff --git a/src/views/LegoDesigner/setters/dataSetters/liListEditor.vue b/src/views/LegoDesigner/setters/dataSetters/liListEditor.vue
new file mode 100644
index 00000000..0915bd05
--- /dev/null
+++ b/src/views/LegoDesigner/setters/dataSetters/liListEditor.vue
@@ -0,0 +1,65 @@
+<template>
+  <div class="li-text-editor-box">
+    <el-form-item label="列表内容:">
+      <div v-for="(item, index) in widgetItem.dataSource.liList" :key="index" class="list-item">
+        <el-input
+          :model-value="item"
+          type="textarea"
+          :rows="4"
+          @input="handleInput($event, index)"
+        />
+        <div class="edit-btn">
+          <el-button
+            :disabled="widgetItem.dataSource.liList.length === 1"
+            type="danger"
+            :icon="SemiSelect"
+            circle
+            @click="deleteContent(index)"
+          />
+          <el-button type="primary" :icon="Plus" circle @click="addContent(index)" />
+        </div>
+      </div>
+    </el-form-item>
+  </div>
+</template>
+<script lang="ts" setup>
+  import useSelectWidgetItem from '../../hooks/useSelectWidgetItem';
+  import { SemiSelect, Plus } from '@element-plus/icons-vue';
+
+  const props = defineProps<{
+    id: string;
+    pageIndex: number;
+  }>();
+
+  // 选中的widgetItem
+  const { widgetItem } = useSelectWidgetItem(props.id, props.pageIndex);
+
+  // 输入框中的值发生改变
+  const handleInput = (value: string, index: number) => {
+    widgetItem.dataSource['liList'][index] = value;
+  };
+
+  // 删除一条
+  const deleteContent = (index: number) => {
+    widgetItem.dataSource['liList'].splice(index, 1);
+  };
+
+  // 添加一条
+  const addContent = (index: number) => {
+    widgetItem.dataSource['liList'].push(widgetItem.dataSource['liList'][index]);
+    console.log('最新的widgetItem', widgetItem);
+  };
+</script>
+<style lang="scss" scoped>
+  .li-text-editor-box {
+    .list-item {
+      display: flex;
+      align-items: center;
+      margin-bottom: 10px;
+      .edit-btn {
+        display: flex;
+        margin-left: 10px;
+      }
+    }
+  }
+</style>
diff --git a/src/views/LegoDesigner/setters/markerColorEditor.vue b/src/views/LegoDesigner/setters/markerColorEditor.vue
new file mode 100644
index 00000000..17880184
--- /dev/null
+++ b/src/views/LegoDesigner/setters/markerColorEditor.vue
@@ -0,0 +1,19 @@
+<template>
+  <div class="marker-color-editor-box">
+    <el-form-item label="标记颜色:">
+      <color-picker-custom-vue v-model="widgetItem.css.markerColor"></color-picker-custom-vue>
+    </el-form-item>
+  </div>
+</template>
+<script lang="ts" setup>
+  import useSelectWidgetItem from '../hooks/useSelectWidgetItem';
+  import ColorPickerCustomVue from '../components/ColorPicker/ColorPickerCustom.vue';
+
+  const props = defineProps<{
+    id: string;
+    pageIndex: number;
+  }>();
+
+  // 选中的widgetItem
+  const { widgetItem } = useSelectWidgetItem(props.id, props.pageIndex);
+</script>
diff --git a/src/views/LegoDesigner/setters/markerPositionEditor.vue b/src/views/LegoDesigner/setters/markerPositionEditor.vue
new file mode 100644
index 00000000..4b75d9ae
--- /dev/null
+++ b/src/views/LegoDesigner/setters/markerPositionEditor.vue
@@ -0,0 +1,73 @@
+<template>
+  <div class="marker-position-editor-box">
+    <el-form-item label="标记对齐:">
+      <div class="layout-box">
+        <div
+          v-for="(item, index) in textAlignList"
+          :key="index"
+          :class="['icon-box', { 'icon-active': item.layout === widgetItem.css.markerPosition }]"
+          @click="handleSelect(item)"
+        >
+          <svg-icon :icon-name="item.iconfont" color="#67c23a" size="18px"></svg-icon>
+        </div>
+      </div>
+    </el-form-item>
+  </div>
+</template>
+<script lang="ts" setup>
+  import useSelectWidgetItem from '../hooks/useSelectWidgetItem';
+
+  const props = defineProps<{
+    id: string;
+    pageIndex: number;
+  }>();
+
+  // 选中的widgetItem
+  const { widgetItem } = useSelectWidgetItem(props.id, props.pageIndex);
+
+  // 对齐方式列表
+  const textAlignList = [
+    {
+      iconfont: 'icon-zuoduiqi',
+      layout: 'inside',
+      label: '左对齐'
+    },
+    {
+      iconfont: 'icon-zuoyouduiqi',
+      layout: 'outside',
+      label: '两端对齐'
+    }
+  ];
+
+  // 选择对齐方式
+  const handleSelect = (item: { layout: string }) => {
+    widgetItem.css.markerPosition = item.layout;
+  };
+</script>
+<style lang="scss" scoped>
+  .marker-position-editor-box {
+    .layout-box {
+      display: flex;
+
+      .icon-box {
+        height: 30px;
+        width: 30px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background-color: rgba($color: #ccc, $alpha: 0);
+        transition: all 0.3s;
+        border-radius: 4px;
+        cursor: pointer;
+        &:hover {
+          background-color: rgba($color: #ccc, $alpha: 0.2);
+        }
+        margin-right: 10px;
+        cursor: pointer;
+      }
+      .icon-active {
+        background-color: rgba($color: #ccc, $alpha: 0.2);
+      }
+    }
+  }
+</style>
diff --git a/src/views/LegoDesigner/setters/markerSizeEditor.vue b/src/views/LegoDesigner/setters/markerSizeEditor.vue
new file mode 100644
index 00000000..de71f419
--- /dev/null
+++ b/src/views/LegoDesigner/setters/markerSizeEditor.vue
@@ -0,0 +1,28 @@
+<template>
+  <div class="marker-size-editor-box">
+    <el-form-item label="标记大小:">
+      <el-input-number v-model="widgetItem.css.markerSize" :min="0" />
+      <span class="unit">像素</span>
+    </el-form-item>
+  </div>
+</template>
+<script lang="ts" setup>
+  import useSelectWidgetItem from '../hooks/useSelectWidgetItem';
+
+  const props = defineProps<{
+    id: string;
+    pageIndex: number;
+  }>();
+
+  // 选中的widgetItem
+  const { widgetItem } = useSelectWidgetItem(props.id, props.pageIndex);
+</script>
+<style lang="scss" scoped>
+  .marker-size-editor-box {
+    .unit {
+      margin-left: 10px;
+      color: #929292;
+      letter-spacing: 2px;
+    }
+  }
+</style>
diff --git a/src/views/LegoDesigner/setters/settersMap.ts b/src/views/LegoDesigner/setters/settersMap.ts
index 6596ae2e..fd276d82 100644
--- a/src/views/LegoDesigner/setters/settersMap.ts
+++ b/src/views/LegoDesigner/setters/settersMap.ts
@@ -11,16 +11,22 @@ import paddingEditor from './paddingEditor.vue';
 import rotateEditor from './rotateEditor.vue';
 import leftEditorVue from './leftEditor.vue';
 import topEditor from './topEditor.vue';
-import avatarUploadEditor from './dataSetters/avatarUploadEditor.vue';
 import fontColorEditor from './fontColorEditor.vue';
 import fontFamilyEditor from './fontFamilyEditor.vue';
 import fontWeightEditor from './fontWeightEditor.vue';
 import fontSizeEditor from './fontSizeEditor.vue';
 import lineHeightEditor from './lineHeightEditor.vue';
 import textAlignEditor from './textAlignEditor.vue';
-import textEditEditor from './dataSetters/textEditEditor.vue';
 import iconColorEditor from './iconColorEditor.vue';
 import iconSizeEditor from './iconSizeEditor.vue';
+import markerSizeEditor from './markerSizeEditor.vue';
+import markerColorEditor from './markerColorEditor.vue';
+import markerPositionEditor from './markerPositionEditor.vue';
+
+// 数据设置组件
+import textEditEditor from './dataSetters/textEditEditor.vue';
+import avatarUploadEditor from './dataSetters/avatarUploadEditor.vue';
+import liListEditor from './dataSetters/liListEditor.vue';
 
 // 属性设置组件对应关系
 export const SETTERS_MAP: ISetterMap = {
@@ -43,11 +49,15 @@ export const SETTERS_MAP: ISetterMap = {
   lineHeight: lineHeightEditor,
   textAlign: textAlignEditor,
   iconColor: iconColorEditor,
-  iconSize: iconSizeEditor
+  iconSize: iconSizeEditor,
+  markerSize: markerSizeEditor,
+  markerColor: markerColorEditor,
+  markerPosition: markerPositionEditor
 };
 
 // 数据设置组件对应关系
 export const DATA_SETTERS_MAP: ISetterMap = {
   avatarSrc: avatarUploadEditor,
-  text: textEditEditor
+  text: textEditEditor,
+  liList: liListEditor
 };
diff --git a/src/views/LegoDesigner/utils/common.ts b/src/views/LegoDesigner/utils/common.ts
index f209c273..a5d8a331 100644
--- a/src/views/LegoDesigner/utils/common.ts
+++ b/src/views/LegoDesigner/utils/common.ts
@@ -8,6 +8,11 @@ export const getAssetsImagesFile = (url: string) => {
   return new URL(`../assets/images/${url}`, import.meta.url).href;
 };
 
+// 获取列表静态资源
+export const getListStyleImageFile = (url: string) => {
+  return new URL(`../widgets/li/listStyleImg/${url}`, import.meta.url).href;
+};
+
 // 重新计算每个组件的top值
 export const computeWidgetTop = (HJSchemaJsonStore: any) => {
   for (let i = 0; i < HJSchemaJsonStore.value.componentsTree.length; i++) {
diff --git a/src/views/LegoDesigner/widgets/index.ts b/src/views/LegoDesigner/widgets/index.ts
index c5ac2b94..5408edcb 100644
--- a/src/views/LegoDesigner/widgets/index.ts
+++ b/src/views/LegoDesigner/widgets/index.ts
@@ -16,6 +16,7 @@ import Text_8 from './text/text-8/text-8.vue';
 import Text_9 from './text/text-9/text-9.vue';
 import Text_10 from './text/text-10/text-10.vue';
 import Icon from './icon/LegoDesignIconRender.vue';
+import Li from './li/LegoLiListRender.vue';
 
 export const WIDGET_MAP: IWidgetMap = {
   'hj-avatar-1': Avatar_1,
@@ -34,5 +35,6 @@ export const WIDGET_MAP: IWidgetMap = {
   'hj-text-8': Text_8,
   'hj-text-9': Text_9,
   'hj-text-10': Text_10,
-  'hj-icon': Icon
+  'hj-icon': Icon,
+  'hj-li': Li
 };
diff --git a/src/views/LegoDesigner/widgets/li/LegoLiList.vue b/src/views/LegoDesigner/widgets/li/LegoLiList.vue
new file mode 100644
index 00000000..7320bd6d
--- /dev/null
+++ b/src/views/LegoDesigner/widgets/li/LegoLiList.vue
@@ -0,0 +1,50 @@
+<template>
+  <ul class="li-list-box">
+    <li ref="liRef">91化简</li>
+  </ul>
+</template>
+<script lang="ts" setup>
+  import { IWidget } from '@/views/LegoDesigner/types';
+  import { getListStyleImageFile } from '../../utils/common';
+
+  interface IAvatar {
+    widgetData: IWidget | null; // 模块数据
+  }
+  const props = withDefaults(defineProps<IAvatar>(), {
+    widgetData: null
+  });
+
+  const liRef = ref<any>(null);
+  const listStyleType = computed(() => {
+    if (props.widgetData?.props.listStyleImage) {
+      liRef.value.style.background = `url(${getListStyleImageFile(
+        props.widgetData?.props.listStyleImage
+      )}) no-repeat`;
+      liRef.value.style.backgroundPosition = 'center left';
+      liRef.value.style.width = '100%';
+      liRef.value.style.paddingLeft = '30px';
+      liRef.value.style.backgroundSize = '28px';
+      return 'none';
+    } else {
+      return `${props.widgetData?.props.listStyleType} outside`;
+    }
+  });
+</script>
+<style lang="scss" scoped>
+  .li-list-box {
+    width: 140px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding-left: 15px;
+    color: #333;
+    li {
+      letter-spacing: 2px;
+      font-weight: 500;
+      font-size: 18px;
+      list-style: v-bind('listStyleType');
+      box-sizing: border-box;
+    }
+  }
+</style>
diff --git a/src/views/LegoDesigner/widgets/li/LegoLiListRender.vue b/src/views/LegoDesigner/widgets/li/LegoLiListRender.vue
new file mode 100644
index 00000000..b7a99150
--- /dev/null
+++ b/src/views/LegoDesigner/widgets/li/LegoLiListRender.vue
@@ -0,0 +1,44 @@
+<template>
+  <ul class="li-1-box">
+    <li v-for="(item, index) in widgetData?.dataSource.liList" :key="index">{{ item }}</li>
+  </ul>
+</template>
+<script lang="ts" setup>
+  import { IWidget } from '@/views/LegoDesigner/types';
+
+  interface IAvatar {
+    widgetData: IWidget | null; // 模块数据
+  }
+  const props = withDefaults(defineProps<IAvatar>(), {
+    widgetData: null
+  });
+
+  const listStyle = computed(() => {
+    return `${props.widgetData?.props.listStyleType} ${props.widgetData?.css.markerPosition}`;
+  });
+</script>
+<style lang="scss" scoped>
+  .li-1-box {
+    width: v-bind('props.widgetData?.css.width + "px"');
+    height: v-bind('props.widgetData?.css.height + "px"');
+    border-style: v-bind('props.widgetData?.css.borderStyle');
+    border-width: v-bind('props.widgetData?.css.borderWidth + "px"');
+    padding: v-bind('props.widgetData?.css.padding.top  + "px"')
+      v-bind('props.widgetData?.css.padding.right + "px"')
+      v-bind('props.widgetData?.css.padding.bottom + "px"')
+      v-bind('props.widgetData?.css.padding.left + "px"');
+    border-color: v-bind('props.widgetData?.css.borderColor');
+    border-radius: v-bind('props.widgetData?.css.borderRadius + "px"');
+    color: v-bind('props.widgetData?.css.fontColor');
+    background: v-bind('props.widgetData?.css.backgroundColor');
+    li {
+      font-family: v-bind('props.widgetData?.css.fontFamily');
+      font-weight: v-bind('props.widgetData?.css.fontWeight');
+      font-size: v-bind('props.widgetData?.css.fontSize + "px"');
+      line-height: v-bind('props.widgetData?.css.lineHeight');
+      text-align: v-bind('props.widgetData?.css.textAlign');
+      list-style-position: v-bind('props.widgetData?.css.markerPosition');
+      list-style: v-bind('listStyle');
+    }
+  }
+</style>
diff --git a/src/views/LegoDesigner/widgets/li/liList.ts b/src/views/LegoDesigner/widgets/li/liList.ts
new file mode 100644
index 00000000..c8ed0a85
--- /dev/null
+++ b/src/views/LegoDesigner/widgets/li/liList.ts
@@ -0,0 +1,78 @@
+export const ListStyleTypeList = [
+  {
+    listStyleType: 'disc',
+    description: '实心圆'
+  },
+  {
+    listStyleType: 'circle',
+    description: '空心圆'
+  },
+  {
+    listStyleType: 'square',
+    description: '实心方块'
+  },
+  {
+    listStyleType: 'decimal',
+    description: '数字'
+  },
+  {
+    listStyleType: 'decimal-leading-zero',
+    description: '数字标记'
+  },
+  {
+    listStyleType: 'lower-roman',
+    description: '小写罗马数字'
+  },
+  {
+    listStyleType: 'upper-roman',
+    description: '大写罗马数字'
+  },
+  {
+    listStyleType: 'lower-greek',
+    description: '小写希腊字母'
+  },
+  {
+    listStyleType: 'lower-latin',
+    description: '小写拉丁字母'
+  },
+  {
+    listStyleType: 'upper-latin',
+    description: '大写拉丁字母'
+  },
+  {
+    listStyleType: 'hebrew',
+    description: '希伯来编号'
+  },
+  {
+    listStyleType: 'armenian',
+    description: '亚美尼亚编号'
+  },
+  {
+    listStyleType: 'georgian',
+    description: '乔治亚编号'
+  },
+  {
+    listStyleType: 'cjk-ideographic',
+    description: '中文数字'
+  },
+  {
+    listStyleType: 'hiragana',
+    description: '日文平假名字符'
+  },
+  {
+    listStyleType: 'katakana',
+    description: '日文片假名字符'
+  },
+  {
+    listStyleType: 'hiragana-iroha',
+    description: '日文平假名序号'
+  },
+  {
+    listStyleType: 'katakana-iroha',
+    description: '日文片假名序号'
+  }
+  // {
+  //   listStyleImage: '招聘求职.svg',
+  //   description: '招聘求职'
+  // }
+];
diff --git "a/src/views/LegoDesigner/widgets/li/listStyleImg/\346\213\233\350\201\230\346\261\202\350\201\214.svg" "b/src/views/LegoDesigner/widgets/li/listStyleImg/\346\213\233\350\201\230\346\261\202\350\201\214.svg"
new file mode 100644
index 00000000..b01dc247
--- /dev/null
+++ "b/src/views/LegoDesigner/widgets/li/listStyleImg/\346\213\233\350\201\230\346\261\202\350\201\214.svg"
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1681341778857" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2520" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M537.2416 538.3168m-393.4208 0a393.4208 393.4208 0 1 0 786.8416 0 393.4208 393.4208 0 1 0-786.8416 0Z" fill="#76BFFF" p-id="2521"></path><path d="M321.1776 867.0208a391.37792 391.37792 0 0 0 216.064 64.7168c217.2928 0 393.4208-176.128 393.4208-393.4208 0-116.4288-50.6368-221.0304-131.0208-293.0688 57.8048 112.2816 127.2832 330.3936-58.112 528.6912-124.2624 132.9152-284.9792 131.6864-420.352 93.0816z" fill="#659CF8" p-id="2522"></path><path d="M524.1856 535.808m-270.592 0a270.592 270.592 0 1 0 541.184 0 270.592 270.592 0 1 0-541.184 0Z" fill="#ECD300" p-id="2523"></path><path d="M697.0368 327.6288c14.0288 33.7408 79.9232 209.5616-14.2336 337.8688-78.5408 107.008-244.2752 112.5376-351.488 60.1088 49.1008 49.8688 117.3504 80.7936 192.8192 80.7936 149.4528 0 270.592-121.1392 270.592-270.592 0.0512-83.7632-37.9392-158.5664-97.6896-208.1792z" fill="#E8A200" p-id="2524"></path><path d="M264.5504 680.4992L134.144 832c-19.4048 22.528-16.8448 56.576 5.6832 75.9808 22.528 19.4048 56.576 16.8448 75.9808-5.6832l125.44-145.7152a292.16768 292.16768 0 0 1-76.6976-76.0832z" fill="#ECD300" p-id="2525"></path><path d="M310.272 741.2736s-103.936 124.8256-114.3808 135.936c-10.4448 11.1104-36.9664 41.9328-71.7312 7.5776 3.0208 8.704 8.2432 16.7424 15.7184 23.1424 22.528 19.4048 56.576 16.8448 75.9808-5.6832l125.44-145.7152c-8.0896-5.4784-15.872-11.3664-23.3472-17.664l-7.68 2.4064z" fill="#E8A200" p-id="2526"></path><path d="M511.0784 77.1584c-111.9744 0-218.3168 42.4448-299.52 119.552a15.36 15.36 0 0 0-0.5632 21.7088 15.36 15.36 0 0 0 21.7088 0.5632c75.4176-71.6288 174.2848-111.104 278.3232-111.104 222.8736 0 404.224 181.3504 404.224 404.224s-181.3504 404.224-404.224 404.224c-66.4576 0-132.3008-16.4864-190.5152-47.616a15.37024 15.37024 0 0 0-20.7872 6.2976 15.37024 15.37024 0 0 0 6.2976 20.7872c62.6176 33.536 133.5296 51.2512 205.0048 51.2512 239.8208 0 434.944-195.1232 434.944-434.944s-195.072-434.944-434.8928-434.944zM143.872 730.6752c2.5088 0 5.0688-0.6144 7.424-1.9456 7.424-4.096 10.0864-13.4656 5.9904-20.8896-33.024-59.5456-50.432-127.232-50.432-195.7376 0-37.888 5.2224-75.3664 15.5648-111.4112 2.3552-8.1408-2.4064-16.64-10.5472-18.9952-8.1408-2.3552-16.64 2.4064-18.9952 10.5472a435.4816 435.4816 0 0 0-16.7424 119.8592c0 73.728 18.7904 146.5344 54.3232 210.5856 2.7648 5.12 7.9872 7.9872 13.4144 7.9872zM129.9968 335.5648a15.2832 15.2832 0 0 0 20.6336-6.7072 408.4736 408.4736 0 0 1 21.76-37.5296 15.3088 15.3088 0 0 0-4.4544-21.248 15.3088 15.3088 0 0 0-21.248 4.4544c-8.4992 13.0048-16.384 26.624-23.3984 40.3968-3.84 7.5264-0.8192 16.7424 6.7072 20.6336z" fill="#333333" p-id="2527"></path><path d="M504.0128 821.76c168.8064 0 306.1248-137.3184 306.1248-306.1248s-137.3184-306.1248-306.1248-306.1248-306.1248 137.3184-306.1248 306.1248c0 8.4992 6.8608 15.36 15.36 15.36s15.36-6.8608 15.36-15.36c0-151.8592 123.5456-275.4048 275.4048-275.4048s275.4048 123.5456 275.4048 275.4048-123.5456 275.4048-275.4048 275.4048c-55.808 0-108.288-16.4864-152.2176-45.5168-0.6144-0.6144-1.2288-1.1776-1.9456-1.6384a275.59936 275.59936 0 0 1-72.6528-72.0896c-0.3584-0.5632-0.8704-1.024-1.3312-1.4848a276.74112 276.74112 0 0 1-34.8672-72.7552 15.29344 15.29344 0 0 0-19.2-10.0864 15.29344 15.29344 0 0 0-10.0864 19.2c8.1408 26.1632 19.5072 50.4832 33.536 72.7552l-122.6752 142.5408a68.73088 68.73088 0 0 0-16.5888 50.3296c1.3824 18.432 9.8816 35.2256 23.8592 47.3088 13.056 11.2128 29.1328 16.7424 45.1072 16.7424 19.456 0 38.8608-8.1408 52.5312-24.0128l116.48-135.3728c46.8992 28.672 101.8368 44.8 160.0512 44.8z m-299.8784 70.5024c-13.8752 16.0768-38.1952 17.92-54.3232 4.0448-16.0768-13.8752-17.92-38.1952-4.0448-54.3232l117.6064-136.6528c16.0256 20.4288 34.56 38.5536 55.04 54.1184l-114.2784 132.8128z" fill="#333333" p-id="2528"></path><path d="M343.552 605.1328a43.12064 43.12064 0 0 0 2.4576 41.9328 44.01152 44.01152 0 0 0 37.4272 20.6848H624.64c15.2576 0 29.2352-7.7312 37.4272-20.6848 8.0384-12.7488 8.96-28.4672 2.4576-41.9328-21.248-44.288-57.344-76.9024-100.1472-92.7744 25.344-18.6368 41.8816-48.5376 41.8816-82.2784 0-56.32-45.824-102.1952-102.1952-102.1952-56.32 0-102.1952 45.824-102.1952 102.1952 0 33.792 16.5376 63.6928 41.8816 82.2784-42.9056 15.872-78.9504 48.4864-100.1984 92.7744zM432.5376 430.08c0-39.424 32.0512-71.4752 71.4752-71.4752S575.488 390.656 575.488 430.08s-32.0512 71.4752-71.4752 71.4752S432.5376 469.4528 432.5376 430.08z m71.4752 102.144c56.3712 0 107.264 33.024 132.8128 86.1696 2.7136 5.6832 0.3584 10.496-0.768 12.288-1.1776 1.8944-4.7104 6.3488-11.4176 6.3488H383.4368c-6.7072 0-10.24-4.4544-11.4176-6.3488-1.1264-1.792-3.4816-6.6048-0.768-12.288 25.4976-53.1456 76.3904-86.1696 132.7616-86.1696z" fill="#333333" p-id="2529"></path><path d="M468.1216 435.968a12.76416 12.76416 0 0 1-12.5952-15.1552c5.0176-26.5216 24.3712-36.5056 35.072-38.1952 6.9632-1.1264 13.568 3.6352 14.6944 10.5984a12.8 12.8 0 0 1-10.3936 14.6432c-1.3312 0.3072-11.4176 2.9696-14.1824 17.7152a12.86656 12.86656 0 0 1-12.5952 10.3936z" fill="#FFFFFF" p-id="2530"></path><path d="M310.272 498.5344c-0.5632 0-1.1264-0.0512-1.6896-0.1024a12.81024 12.81024 0 0 1-11.008-14.3872c0.768-5.5808 1.6896-11.1616 2.8672-16.5376a12.73344 12.73344 0 0 1 15.2064-9.7792c6.912 1.4848 11.3152 8.2944 9.7792 15.2064-1.024 4.7104-1.8944 9.5744-2.5088 14.4896a12.7488 12.7488 0 0 1-12.6464 11.1104z" fill="#FFFFFF" p-id="2531"></path><path d="M327.2704 441.856c-1.8944 0-3.84-0.4096-5.6832-1.3312a12.7488 12.7488 0 0 1-5.7856-17.152c22.6816-45.8752 56.4736-66.1504 57.9072-67.0208 6.0928-3.584 13.9264-1.536 17.5104 4.5568 3.584 6.0928 1.5872 13.9264-4.5056 17.5104-0.512 0.3072-28.928 17.7664-47.9744 56.32-2.2528 4.5056-6.7584 7.1168-11.4688 7.1168z" fill="#FFFFFF" p-id="2532"></path><path d="M197.4272 839.8848c-2.9184 0-5.888-1.024-8.2944-3.072a12.75392 12.75392 0 0 1-1.4336-18.0224l4.7104-5.5808a12.75392 12.75392 0 0 1 18.0224-1.4336c5.376 4.5568 6.0416 12.6464 1.4336 18.0224l-4.7104 5.5808c-2.5088 2.9696-6.0928 4.5056-9.728 4.5056z" fill="#FFFFFF" p-id="2533"></path><path d="M226.0992 806.144c-2.9184 0-5.888-1.024-8.2944-3.0208a12.80512 12.80512 0 0 1-1.4848-18.0224l22.9888-27.0848a12.80512 12.80512 0 0 1 18.0224-1.4848c5.376 4.5568 6.0416 12.6464 1.4848 18.0224l-22.9888 27.0848c-2.5088 2.9696-6.0928 4.5056-9.728 4.5056z" fill="#FFFFFF" p-id="2534"></path></svg>
\ No newline at end of file
diff --git a/src/views/LegoDesigner/widgets/li/useLiListItem.ts b/src/views/LegoDesigner/widgets/li/useLiListItem.ts
new file mode 100644
index 00000000..72ce4840
--- /dev/null
+++ b/src/views/LegoDesigner/widgets/li/useLiListItem.ts
@@ -0,0 +1,60 @@
+import { IWidget } from '../../types';
+
+/**
+ * @description 返回图标对象
+ */
+export const useLiListItem = (iconItem: {
+  listStyleType: any;
+  description: any;
+  listStyleImage?: any;
+}): IWidget => {
+  return {
+    id: '', // 组件唯一性id
+    componentName: 'hj-li', // 组件名
+    commentType: '', // 组件类型
+    icon: '', // 组件icon
+    title: '', // 组件中文名称
+    description: iconItem.description, // 组件描述信息
+    screenShot: {
+      src: '',
+      width: '',
+      height: '',
+      borderRadius: ''
+    }, // 组件快照
+    keywords: '头像', // 组件关键词，用于搜索
+    category: 'li', // 组件分类
+    props: {
+      listStyleType: iconItem.listStyleType,
+      listStyleImage: iconItem.listStyleImage
+    }, // 组件属性
+    css: {
+      left: 0,
+      top: 0,
+      zIndex: 1,
+      width: 80,
+      height: 40,
+      rotate: 0, // 旋转角度
+      fontSize: 14,
+      lineHeight: 1.5,
+      fontFamily: '方正黑体简体',
+      fontColor: '#333333',
+      fontWeight: 500,
+      textAlign: 'justify',
+      markerPosition: 'inside',
+      padding: {
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 3
+      },
+      borderWidth: 0,
+      borderRadius: 10,
+      borderColor: '#eee',
+      backgroundColor: '#fff',
+      borderStyle: 'solid'
+    }, // 组件样式
+    dataSource: {
+      liList: ['91化简', '91化简'] // 内容列表
+    } // 组件单独数据
+  };
+};
diff --git a/src/views/webCode/components/PriceTable.vue b/src/views/webCode/components/PriceTable.vue
index e5cce0bd..c50ad685 100644
--- a/src/views/webCode/components/PriceTable.vue
+++ b/src/views/webCode/components/PriceTable.vue
@@ -98,13 +98,6 @@
       CNY399: '✓',
       CNY699: '✓'
     },
-    {
-      rights: '部署服务',
-      free: 'X',
-      CNY99: 'X',
-      CNY399: '（替您部署网站）✓',
-      CNY699: '✓'
-    },
     {
       rights: '一对一技术咨询',
       free: 'X',