瀏覽代碼

Merge branch 'local' of github.com:le5le-com/visualization-design into local

Grnetsky 1 年之前
父節點
當前提交
2214a9c30c

+ 3 - 3
index.html

@@ -22,12 +22,12 @@
         fill: currentColor;
         overflow: hidden;
       }
-    </style>
+    </style> 
     <link
-      href="//at.alicdn.com/t/c/font_4042197_dopqcs38fz5.css"
+      href="//at.alicdn.com/t/c/font_4042197_h5hgbmc7d75.css"
       rel="stylesheet"
     />
-    <script src="//at.alicdn.com/t/c/font_4042197_8nkauko228g.js"></script>
+    <script src="//at.alicdn.com/t/c/font_4042197_h5hgbmc7d75.js"></script>
   </head>
   <body>
     <div id="app"></div>

+ 17 - 0
public/img/icon_search_gray.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>icon_search_heater_gray</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="修改页面--资源" transform="translate(-96.000000, -118.000000)">
+            <g id="编组-20" transform="translate(76.000000, 111.000000)">
+                <g id="icon_search_heater_gray" transform="translate(20.000000, 7.000000)">
+                    <rect id="透明底图" fill-opacity="0" fill="#FFFFFF" x="0" y="0" width="14" height="14"></rect>
+                    <g id="Page" transform="translate(0.875000, 0.875000)" fill="#B6B9BF">
+                        <path d="M8.75696393,8.75012799 C8.9705319,8.53656002 9.316794,8.53656002 9.53036197,8.75012799 L12.0149032,11.2346692 C12.143044,11.36281 12.143044,11.5705672 12.0149032,11.698708 L11.705544,12.0080672 C11.5774032,12.136208 11.3696459,12.136208 11.2415051,12.0080672 L8.75696393,9.52352603 C8.54339596,9.30995806 8.54339596,8.96369596 8.75696393,8.75012799 Z" id="矩形"></path>
+                        <path d="M5.46875,0 C8.48905723,0 10.9375,2.44844277 10.9375,5.46875 C10.9375,8.48905723 8.48905723,10.9375 5.46875,10.9375 C2.44844277,10.9375 0,8.48905723 0,5.46875 C0,2.44844277 2.44844277,0 5.46875,0 Z M5.46875,1.09375 C3.05250422,1.09375 1.09375,3.05250422 1.09375,5.46875 C1.09375,7.88499578 3.05250422,9.84375 5.46875,9.84375 C7.88499578,9.84375 9.84375,7.88499578 9.84375,5.46875 C9.84375,3.05250422 7.88499578,1.09375 5.46875,1.09375 Z" id="椭圆形" fill-rule="nonzero"></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

+ 3 - 0
src/services/common.ts

@@ -285,6 +285,9 @@ export const save = async (
     for (const k of delAttrs) {
       delete (data as any)[k];
     }
+    if (!data.tags || !data.tags.length) {
+      data.tags = ['方案'];
+    }
     ret = await addCollection(collection, data);
   } else {
     // if (data._id && data.teams && data.owner?.id !== user.id) {

+ 84 - 62
src/services/defaults.ts

@@ -1026,6 +1026,7 @@ export const formComponents = [
           progressColor: '#4583FF',
           progress: 0.8,
           background: '#303746',
+          disableInput: true,
           lineWidth: 0,
           borderWidth: 0,
           props: {
@@ -1232,11 +1233,6 @@ export const formComponents = [
                 label: '显示格式',
                 type: 'string',
               },
-              {
-                key: 'borderWidth',
-                label: '显示格式',
-                type: 'string',
-              },
             ],
           },
         },
@@ -1278,7 +1274,7 @@ export const formComponents = [
           height: 40,
           hiddenText: true,
           direction: 'horizontal',
-          labelAlign: 'left', //left/right/alternate/top/bottom
+          labelAlign: 'top', //left/right/alternate/top/bottom
           mode: 'alternate', //alternate
           data: [
             {
@@ -1456,7 +1452,6 @@ export const formComponents = [
           background: '#282E3B',
           textColor: '#FFFFFF66',
           hoverTextColor: '#FFFFFF66',
-          // borderWidth:1,
           data: [
             {
               title: '列表标题',
@@ -1528,11 +1523,11 @@ export const formComponents = [
                   text: '编辑',
                   fontSize: 0.6,
                   disableAnchor: true,
-                  activeBackground: '#40a9ff',
+                  activeBackground: '#2D71EC',
                   activeColor: '#40a9ff',
-                  background: '#1890ff',
+                  background: '#4583FF',
                   color: '#1890ff',
-                  hoverBackground: '#40a9ff',
+                  hoverBackground: '#7DA4FF',
                   hoverColor: '#40a9ff',
                   textColor: '#ffffff',
                   hoverTextColor: '#ffffff',
@@ -1552,11 +1547,11 @@ export const formComponents = [
                   text: '实时数据',
                   fontSize: 0.6,
                   disableAnchor: true,
-                  activeBackground: '#40a9ff',
+                  activeBackground: '#2D71EC',
                   activeColor: '#40a9ff',
-                  background: '#1890ff',
+                  background: '#4583FF',
                   color: '#1890ff',
-                  hoverBackground: '#40a9ff',
+                  hoverBackground: '#7DA4FF',
                   hoverColor: '#40a9ff',
                   textColor: '#ffffff',
                   hoverTextColor: '#ffffff',
@@ -1613,7 +1608,7 @@ export const formComponents = [
               'MQTT',
               {
                 text: '一级告警',
-                background: '#650b09',
+                // background: '#650b09',
                 textColor: '#FF5D3CFF',
               },
             ],
@@ -1623,7 +1618,7 @@ export const formComponents = [
               'MQTT',
               {
                 text: '二级告警',
-                background: '#4d2a02',
+                // background: '#4d2a02',
                 textColor: '#E6A82EFF',
               },
             ],
@@ -1633,7 +1628,7 @@ export const formComponents = [
               'MQTT',
               {
                 text: '一级告警',
-                background: '#650b09',
+                // background: '#650b09',
                 textColor: '#FF5D3CFF',
               },
             ],
@@ -1644,7 +1639,7 @@ export const formComponents = [
               {
                 text: '三级告警',
                 textColor: '#58CC84FF',
-                background: '#042617;',
+                // background: '#042617;',
               },
             ],
           ],
@@ -2085,14 +2080,14 @@ export const formComponents = [
           textColor: '#0052d9',
           events: [
             {
-              where: {
-                type: null,
-              },
               name: 'click',
-              action: 0,
-              params: '_blank',
-              value: 'https://2d.le5le.com/',
-              fn: null,
+              actions: [
+                {
+                  action: 0,
+                  params: '_blank',
+                  value: 'https://2d.le5le.com/',
+                },
+              ],
             },
           ],
         },
@@ -2108,10 +2103,13 @@ export const formComponents = [
           iconFamily: 'l-icon',
           events: [
             {
-              action: 5,
               name: 'click',
-              value: 'window.history.go(-1);',
-              where: { type: null },
+              actions: [
+                {
+                  action: 5,
+                  value: 'window.history.go(-1);',
+                },
+              ],
             },
           ],
         },
@@ -2126,13 +2124,22 @@ export const formComponents = [
           icon: '\uea7b',
           iconFamily: 'l-icon',
           events: [
+            // {
+            //   action: 5,
+            //   name: 'click',
+            //   params: 'pen.id/tag',
+            //   value:
+            //     'let pens = context.meta2d.find(params);\r\nif (!pens.length) {\r\n    pens = [pen]\r\n}\r\ncontext.meta2d.active(pens, true);\r\ncontext.meta2d.gotoView(pens[0]);\r\ncontext.meta2d.resize();\r\ncontext.meta2d.render();',
+            //   where: { type: null },
+            // },
             {
-              action: 5,
               name: 'click',
-              params: 'pen.id/tag',
-              value:
-                'let pens = context.meta2d.find(params);\r\nif (!pens.length) {\r\n    pens = [pen]\r\n}\r\ncontext.meta2d.active(pens, true);\r\ncontext.meta2d.gotoView(pens[0]);\r\ncontext.meta2d.resize();\r\ncontext.meta2d.render();',
-              where: { type: null },
+              actions: {
+                action: 5,
+                params: 'pen.id/tag',
+                value:
+                  'let pens = context.meta2d.find(params);\r\nif (!pens.length) {\r\n    pens = [pen]\r\n}\r\ncontext.meta2d.active(pens, true);\r\ncontext.meta2d.gotoView(pens[0]);\r\ncontext.meta2d.resize();\r\ncontext.meta2d.render();',
+              },
             },
           ],
         },
@@ -2163,17 +2170,27 @@ export const formComponents = [
           icon: '\uec57',
           iconFamily: 'l-icon',
           events: [
+            // {
+            //   action: 5,
+            //   name: 'click',
+            //   // params: 'pen.id/tag',
+            //   value: `
+            //   const { scale, origin, y: dataY } = context.meta2d.store.data;
+            //   context.meta2d.translate(
+            //     0,
+            //     ((parseInt(params)||32) * context.meta2d.store.data.scale - origin.y) / scale - dataY / scale
+            //   );`,
+            //   where: { type: null },
+            // },
             {
-              action: 5,
               name: 'click',
-              // params: 'pen.id/tag',
-              value: `
-              const { scale, origin, y: dataY } = context.meta2d.store.data;
-              context.meta2d.translate(
-                0,
-                ((parseInt(params)||32) * context.meta2d.store.data.scale - origin.y) / scale - dataY / scale
-              );`,
-              where: { type: null },
+              actions: [
+                {
+                  action: 0,
+                  params: '_blank',
+                  value: 'https://2d.le5le.com/',
+                },
+              ],
             },
           ],
         },
@@ -2282,12 +2299,13 @@ export const formComponents = [
               title: '实时监测',
               key: '0',
               show: true,
-              icon: 'l-icon t-10',
+              icon: 'l-icon l-suofang',
               children: [
                 {
                   title: '站点看板',
                   key: '',
                   show: true,
+                  icon: 'l-icon l-fenzuzhuzhuangtu',
                   children: [
                     {
                       title: '三级标题',
@@ -2305,16 +2323,13 @@ export const formComponents = [
                   title: '监控画面',
                   key: '',
                   show: true,
+                  icon: 'l-icon l-biaoge',
                 },
                 {
                   title: '设备监控',
                   key: '',
                   show: true,
-                },
-                {
-                  title: '变压器监测',
-                  key: '',
-                  show: true,
+                  icon: 'l-icon l-zhexiantu',
                 },
               ],
             },
@@ -2322,11 +2337,13 @@ export const formComponents = [
               title: '控制中心',
               key: '',
               show: true,
+              icon: 'l-icon l-tiaoxingtu',
             },
             {
               title: '告警管理',
               key: '',
               show: true,
+              icon: 'l-icon l-zhishideng',
             },
           ],
           expand: true,
@@ -2381,21 +2398,20 @@ export const formComponents = [
           width: 500,
           height: 40,
           hiddenText: true,
-          direction: 'vertical', //horizontal/vertical
+          direction: 'horizontal', //horizontal/vertical
           labelAlign: '', //left/right/alternate/top/bottom
           // theme: 'dot', //dot
           current: 2,
           data: [
             {
               title: '已完成的步骤',
-              content:
-                '这里是提示文字dsafsdfadfafadsfdfadfadsfdafdafdasfsdfdfadfdafasdffdfadds',
+              content: '这里是提示文字',
               status: 'finish', //default/process/finish/error
               // path: 'M71.3,61.9v2.21L56.66,66V63.82l3.27-.43.25-1-2.39.31V60.84l2.84-.37.21-.87-3.4.44V57.85l13.08-1.73v2.2l-6.85.9-.21.88,6-.79-.15,2.85ZM58.11,66.56,69.86,65v5.63L58.11,72.19Zm2.59,3.09,6.44-.84V67.52l-6.44.85ZM62.78,63l3.87-.51.07-.95L63,62.05Z',
             },
             {
               title: '出错的步骤',
-              content: '这里是提示文字ssss',
+              content: '这里是提示文字',
               status: 'error', //default/process/finish/error
             },
             {
@@ -2486,12 +2502,12 @@ export const formComponents = [
           disableAnchor: true,
           borderRadius: 2,
           text: '按钮',
-          activeBackground: '#40a9ff',
+          activeBackground: '#2D71EC',
           activeColor: '#40a9ff',
-          background: '#1890ff',
+          background: '#4583FF',
           color: '#1890ff',
           hoverBackground: '#40a9ff',
-          hoverColor: '#40a9ff',
+          hoverColor: '#7DA4FF',
           textColor: '#ffffff',
           hoverTextColor: '#ffffff',
           activeTextColor: '#ffffff',
@@ -2512,8 +2528,10 @@ export const formComponents = [
           ellipsis: true,
           text: '输入文本',
           textAlign: 'left',
+          background:'#15181C',
+          color:'#424B61',
+          textColor: '#FFFFFFE6',
           // color: '#D9D9D9FF',
-          // textColor: '#000000FF',
           // hoverTextColor: '#000000FF',
           // activeTextColor: '#000000FF',
           textLeft: 10,
@@ -2534,6 +2552,9 @@ export const formComponents = [
           ellipsis: true,
           text: '输入数字',
           textAlign: 'left',
+          background:'#15181C',
+          color:'#424B61',
+          textColor: '#FFFFFFE6',
           // color: '#D9D9D9FF',
           // textColor: '#000000FF',
           // hoverTextColor: '#000000FF',
@@ -2655,10 +2676,11 @@ export const formComponents = [
           text: '选项1',
           textAlign: 'left',
           input: true,
-          color: '#D9D9D9FF',
-          textColor: '#FFFFFF',
-          hoverTextColor: '#FFFFFF',
-          activeTextColor: '#FFFFFF',
+          background:'#15181C',
+          color:'#424B61',
+          textColor: '#FFFFFFE6',
+          hoverTextColor: '#FFFFFFE6',
+          activeTextColor: '#FFFFFFE6',
           textLeft: 10,
           dropdownList: [
             {
@@ -2724,8 +2746,8 @@ export const formComponents = [
           height: 30,
           width: 60,
           checked: true,
-          offColor: '#BFBFBF',
-          onColor: '#1890ff',
+          offColor: '#303746',
+          onColor: '#4583FF',
           disableOffColor: '#E5E5E5',
           disableOnColor: '#A3D3FF',
           hoverBackground: '#40a9ff',
@@ -2745,7 +2767,7 @@ export const formComponents = [
           barHeight: 4,
           min: 0,
           max: 100,
-          color: '#4583FF1890ff',
+          activeColor: '#4583FF',
           background: '#303746',
           textColor: '#FFFFFF66',
           unit: '%',

+ 2 - 1
src/services/utils.ts

@@ -105,7 +105,8 @@ export async function dealwithFormatbeforeOpen(data: Meta2dBackData) {
       if (
         pen.image &&
         pen.image.startsWith('/') &&
-        !pen.image.startsWith('/v/')
+        !pen.image.startsWith('/v/') &&
+        !pen.image.startsWith('/png/')
       ) {
         pen.image = upCdn + pen.image;
       }

+ 5 - 0
src/styles/tdesign.css

@@ -616,3 +616,8 @@
 .t-image__wrapper {
   background: none;
 }
+
+.t-image__wrapper--shape-square {
+  width: 100%;
+  height: 100%;
+}

+ 5 - 4
src/views/components/FileProps.vue

@@ -336,7 +336,7 @@ const dataTransformationDialog = reactive<any>({
 const selectedSreen = (item: any) => {
   meta2d.store.data.width = item.width;
   meta2d.store.data.height = item.height;
-  meta2d.store.patchFlagsBackground = true;
+  // meta2d.store.patchFlagsBackground = true;
   meta2d.render();
   openData();
 };
@@ -353,14 +353,14 @@ const fileSuccessed = async (content: any) => {
   // meta2d.store.patchFlagsBackground = true;
   meta2d.setBackgroundImage(content.response.url);
   setTimeout(() => {
-    meta2d.store.patchFlagsBackground = true;
+    // meta2d.store.patchFlagsBackground = true;
     meta2d.render();
   }, 1000);
 };
 
 const fileRemoved = () => {
   meta2d.setBackgroundImage('');
-  meta2d.store.patchFlagsBackground = true;
+  // meta2d.store.patchFlagsBackground = true;
   meta2d.render();
   data.background = [];
 };
@@ -369,7 +369,8 @@ const changeValue = (e: any, key: string) => {
   // @ts-ignore
   meta2d.store.data[key] = e;
   if (key === 'background') {
-    meta2d.store.patchFlagsBackground = true;
+    // meta2d.store.patchFlagsBackground = true;
+    meta2d.setBackgroundColor(e);
   }
   meta2d.render();
   openData();

+ 26 - 11
src/views/components/Graphics.vue

@@ -24,7 +24,8 @@
       <div class="list" :class="groupType ? 'two-columns' : ''">
         <div class="input-search">
           <div class="btn">
-            <t-icon name="search" />
+            <!-- <t-icon name="search" /> -->
+            <img src="/img/icon_search_gray.svg" />
           </div>
           <t-input
             v-model="search"
@@ -525,13 +526,12 @@ const groupChange = async (name: string) => {
       userLastName = name;
       break;
   }
-
-  if (!activedPanels[name]) {
-    activedPanels[name] = [];
-    for (const item of subGroups.value) {
-      activedPanels[name].push(item.name);
-    }
+  // if (!activedPanels[name]) {
+  activedPanels[name] = [];
+  for (const item of subGroups.value) {
+    activedPanels[name].push(item.name);
   }
+  // }
 
   searchGraphics();
 };
@@ -1594,9 +1594,18 @@ onUnmounted(() => {
     justify-content: center;
     align-items: center;
     display: flex;
+    .t-radio-group.t-radio-group--filled {
+      padding: 0px;
+      height: 30px;
+    }
+    :deep(.t-radio-button__label) {
+      margin: auto;
+    }
     .t-radio-button {
+      width: 120px;
+      height: 100%;
       &.t-is-checked {
-        background-color: var(--color-primary-hover) !important;
+        background-color: var(--color-primary) !important;
         color: #fff !important;
       }
     }
@@ -1643,15 +1652,21 @@ onUnmounted(() => {
       /* padding-top: 8px; */
       .input-search {
         flex-shrink: 0;
-        height: 40px;
+        /* height: 40px; */
         position: sticky;
         top: 0px;
         z-index: 10;
+        padding: 16px;
+        color: #878f9c;
         .btn {
           background: #fff0;
-          .t-icon {
-            background: #fff0;
+          img {
+            background-color: #fff0;
+            margin-top: 9px;
           }
+          /* .t-icon {
+            background: #fff0;
+          } */
         }
       }
       * {

+ 6 - 2
src/views/components/Header.vue

@@ -349,7 +349,7 @@ onBeforeMount(async () => {
 const logout = () => {
   signout();
   meta2d.emit('logout');
-}
+};
 const onInputName = () => {
   (meta2d.store.data as Meta2dBackData).name = data.name;
   setDot();
@@ -842,6 +842,10 @@ const downloadImageTips =
   '无法下载,宽度不合法,画布可能没有画笔/画布大小超出浏览器最大限制';
 
 const downloadPng = () => {
+  if (!meta2d.store.data.pens.length) {
+    MessagePlugin.warning(downloadImageTips);
+    return;
+  }
   try {
     meta2d.downloadPng();
   } catch (e) {
@@ -1072,7 +1076,7 @@ const changeDisableAnchor = () => {
     }
 
     &.active {
-      background-color: var(--color-primary-hover);
+      background-color: var(--color-primary);
       color: #ffffff;
     }
   }

+ 9 - 0
src/views/components/PenDatas.vue

@@ -243,6 +243,15 @@
           <label>模拟值:</label>
           <t-input v-model="dataBindDialog.data.mock" />
         </div>
+        <div class="form-item mt-20">
+          <label>类型:</label>
+          <t-select
+            class="w-full"
+            :options="typeOptions"
+            v-model="dataBindDialog.data.type"
+            placeholder="字符串"
+          />
+        </div>
         <div class="form-item mt-12">
           <label>开启:</label>
           <t-switch

+ 83 - 0
src/views/components/PenProps.vue

@@ -48,6 +48,38 @@
               </template>
             </t-select-input>
           </div>
+          <div class="form-item px-12" style="margin-top: -12px">
+            <label style="width: 50px">模板</label>
+            <t-switch
+              class="mt-8 ml-8"
+              v-model="data.pen.template"
+              size="small"
+              @change="changeValue('template')"
+            />
+          </div>
+          <t-divider style="margin: -8px 0" />
+          <div style="margin: 0 16px 16px 16px">
+            <t-space direction="vertical" size="small" class="w-full">
+              <div style="color: var(--color); margin-bottom: 2px">
+                大屏对齐
+              </div>
+              <div class="icons">
+                <t-tooltip
+                  v-for="item in aligns"
+                  :content="item.label"
+                  placement="top"
+                >
+                  <svg
+                    class="l-icon btn"
+                    aria-hidden="true"
+                    @click="align(item.value)"
+                  >
+                    <use :xlink:href="item.icon"></use>
+                  </svg>
+                </t-tooltip>
+              </div>
+            </t-space>
+          </div>
           <t-divider style="margin: -8px 0" />
           <div class="form-item" style="margin-top: -12px">
             <t-input
@@ -1148,6 +1180,43 @@ const iconsDrawer = reactive<any>({
   show: false,
 });
 
+const aligns = [
+  {
+    value: 'left',
+    label: '左对齐',
+    icon: '#l-align-left',
+  },
+  {
+    value: 'center',
+    label: '垂直居中对齐',
+    icon: '#l-align-center',
+  },
+  {
+    value: 'right',
+    label: '右对齐',
+    icon: '#l-align-right',
+  },
+  {
+    value: 'top',
+    label: '顶部对齐',
+    icon: '#l-align-top',
+  },
+  {
+    value: 'middle',
+    label: '水平居中对齐',
+    icon: '#l-align-middle',
+  },
+  {
+    value: 'bottom',
+    label: '底部对齐',
+    icon: '#l-align-bottom',
+  },
+];
+
+const align = (align: string) => {
+  meta2d.alignNodesV(align, meta2d.store.active);
+};
+
 onBeforeMount(() => {
   if (inTreePanel.value) {
     data.tab = 5;
@@ -1387,5 +1456,19 @@ onUnmounted(() => {
 </script>
 <style lang="postcss" scoped>
 .props {
+  .icons {
+    display: flex;
+
+    svg:hover {
+      cursor: pointer;
+      color: var(--color-primary);
+    }
+
+    .btn {
+      font-size: 16px;
+      margin-right: 16px;
+      color: var(--color);
+    }
+  }
 }
 </style>

+ 18 - 9
src/views/components/PensProps.vue

@@ -60,6 +60,15 @@
               />
             </div>
           </div>
+          <div class="form-item px-16" style="margin-top: -12px">
+            <label style="width: 50px">模板</label>
+            <t-switch
+              class="mt-8 ml-8"
+              size="small"
+              v-model="data.template"
+              @change="changeValue('template')"
+            />
+          </div>
           <t-collapse
             :defaultValue="['1', '2', '3', '4']"
             expandIconPlacement="right"
@@ -786,7 +795,7 @@ import { updatePen } from './pen';
 
 import { useSelection } from '@/services/selections';
 import { fonts, setChildrenVisible } from '@/services/common';
-import {defaultGradientColor, defaultPureColor} from "@/services/defaults";
+import { defaultGradientColor, defaultPureColor } from '@/services/defaults';
 
 const { selections } = useSelection();
 
@@ -803,8 +812,8 @@ const aligns = [
     icon: '#l-align-left',
   },
   {
-    value: 'right',
-    label: '水平居中对齐',
+    value: 'center',
+    label: '垂直居中对齐',
     icon: '#l-align-center',
   },
   {
@@ -818,8 +827,8 @@ const aligns = [
     icon: '#l-align-top',
   },
   {
-    value: 'right',
-    label: '垂直居中对齐',
+    value: 'middle',
+    label: '水平居中对齐',
     icon: '#l-align-middle',
   },
   {
@@ -846,8 +855,8 @@ const aligns2 = [
     icon: '#l-align-left',
   },
   {
-    value: 'right',
-    label: '水平居中对齐',
+    value: 'center',
+    label: '垂直居中对齐',
     icon: '#l-align-center',
   },
   {
@@ -861,8 +870,8 @@ const aligns2 = [
     icon: '#l-align-top',
   },
   {
-    value: 'right',
-    label: '垂直居中对齐',
+    value: 'middle',
+    label: '水平居中对齐',
     icon: '#l-align-middle',
   },
   {

+ 21 - 4
src/views/components/View.vue

@@ -28,7 +28,7 @@
             :count="dot ? 1 : 0"
           >
             <t-icon
-              name="view-module"
+              name="root-list"
               @click="
                 !route.query.c && save(SaveType.Save, 'le5leV-template', true)
               "
@@ -39,7 +39,7 @@
       <t-tooltip content="保存为我的组件" placement="bottom">
         <a :class="{ gray: route.query.id && !route.query.c }">
           <t-icon
-            name="layers"
+            name="app"
             @click="
               (!route.query.id || route.query.c) &&
                 save(SaveType.Save, 'le5leV-components', true)
@@ -241,8 +241,24 @@
         :content="canScale ? '允许缩放' : '禁止缩放'"
         placement="bottom"
       >
-        <t-icon v-if="canScale" name="unfold-more" @click="onCanScale(false)" />
-        <t-icon v-else name="unfold-less" @click="onCanScale(true)" />
+        <a>
+          <svg
+            v-if="canScale"
+            class="l-icon"
+            aria-hidden="true"
+            @click="onCanScale(false)"
+          >
+            <use xlink:href="#l-suofang"></use>
+          </svg>
+          <svg
+            v-else
+            class="l-icon"
+            aria-hidden="true"
+            @click="onCanScale(true)"
+          >
+            <use xlink:href="#l-jinzhisuofang"></use>
+          </svg>
+        </a>
       </t-tooltip>
       <t-tooltip :content="isLock ? '浏览模式' : '编辑模式'" placement="bottom">
         <a>
@@ -1765,6 +1781,7 @@ const onSuccessChargeCloud = () => {
     border-top: 1px solid var(--color-background-input);
     height: calc(100vh - 81px);
     z-index: 1;
+    overflow: hidden;
 
     :deep(.meta2d-map) {
       background: var(--color-background);