Merge branch 'main' of http://123.132.248.154:10000/gitY/LinYeFangHuo

src/packages/components/Decorates/Titles/Date/index.vue

@@ -11,7 +11,7 @@
   </template>
   
   <script setup lang="ts">
-  import { ref, PropType, onMounted, toRefs } from 'vue';
+  import { ref, PropType, onMounted,onUnmounted, toRefs } from 'vue';
   import dayjs from 'dayjs';
   import { CreateComponentType } from '@/packages/index.d';
   const props = defineProps({
@@ -24,13 +24,19 @@
   
   const { w, h } = toRefs(props.chartConfig.attr)
   const { textSize, textColor,textSize1, textColor1} = toRefs(props.chartConfig.option)
-
-  onMounted(() => {
-    console.log('currentTime', currentTime)
-  });
   const currentDate = ref(dayjs().locale('zh-cn').format('YYYY.M.D'));
-  const currentTime = ref(dayjs().locale('zh-cn').format('HH:mm:ss'));
-    
+  let currentTime = ref()
+  const updateTime = () => {
+    const now = new Date();
+    currentTime.value = dayjs().locale('zh-cn').format('HH:mm:ss');; // 格式为hh:mm:ss
+  };
+  onMounted(() => {
+    updateTime();
+    const interval = setInterval(updateTime, 1000);
+    onUnmounted(() => {
+      clearInterval(interval);
+    });
+  });
   
   </script>
   

src/packages/components/Decorates/Titles/TitlesText/config.ts

@@ -7,7 +7,8 @@ import cloneDeep from 'lodash/cloneDeep'
 export const option = {
   colors: ['#1DC1F533', '#1DC1F5FF'],
   dataset: '我是标题',
-  textSize: 32
+  textSize: 32,
+  textFlod: 500
 }
 
 export default class Config extends PublicConfigClass implements CreateComponentType {

src/packages/components/Decorates/Titles/TitlesText/config.vue

@@ -29,6 +29,9 @@
     <SettingItem name="大小">
       <n-input-number v-model:value="optionData.textSize" size="small" :min="12"></n-input-number>
     </SettingItem>
+    <SettingItem name="粗细">
+      <n-input-number v-model:value="optionData.textFlod" size="small" :min="400"></n-input-number>
+    </SettingItem>
   </CollapseItem>
 </template>
 

src/packages/components/Decorates/Titles/TitlesText/index.vue

@@ -20,7 +20,7 @@
   
   const id = getUUID()
   const { w, h } = toRefs(props.chartConfig.attr)
-  const { colors, dataset, textSize } = toRefs(props.chartConfig.option)
+  const { colors, dataset, textSize,textFlod } = toRefs(props.chartConfig.option)
   </script>
   
   <style lang="scss" scoped>
@@ -47,6 +47,7 @@
   
     .text {
       font-size: v-bind('textSize+"px"');
+      font-weight: v-bind('textFlod');
       background: linear-gradient(to bottom, v-bind('colors[0]'), v-bind('colors[1]')); 
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent; /* 兼容旧版浏览器 */

src/packages/components/Units/Titles/RightBox01/config.ts

@@ -0,0 +1,17 @@
+import { PublicConfigClass } from '@/packages/public'
+import { chartInitConfig } from '@/settings/designSetting'
+import { CreateComponentType } from '@/packages/index.d'
+import { RightBox01Config } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+
+export const option = {
+  boxId: 'RightBox01',
+  colors: ['#06463A','#02221B'],
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType {
+  public key = RightBox01Config.key
+  public attr = { ...chartInitConfig, w: 382, h: 265, zIndex: 1 }
+  public chartConfig = cloneDeep(RightBox01Config)
+  public option = cloneDeep(option)
+}

src/packages/components/Units/Titles/RightBox01/config.vue

@@ -0,0 +1,53 @@
+<template>
+  <CollapseItem name="内容" :expanded="true">
+    <SettingItemBox name="ID" :alone="true">
+      <n-input
+        size="small"
+        v-model:value="optionData.boxId"
+        :minlength="1"
+        type="text"
+        placeholder="请输入Id"
+      />
+    </SettingItemBox> 
+  </CollapseItem>
+  <CollapseItem name="样式" :expanded="true">
+    <SettingItemBox
+      :name="`颜色-${index + 1}`"
+      v-for="(item, index) in optionData.colors"
+      :key="index"
+    >
+      <SettingItem name="颜色">
+        <n-color-picker
+          size="small"
+          :modes="['hex']"
+          v-model:value="optionData.colors[index]"
+        ></n-color-picker>
+      </SettingItem>
+      <SettingItem>
+        <n-button
+          size="small"
+          @click="optionData.colors[index] = option.colors[index]"
+        >
+          恢复默认
+        </n-button>
+      </SettingItem>
+    </SettingItemBox>
+  </CollapseItem>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import {
+  CollapseItem,
+  SettingItemBox,
+  SettingItem
+} from '@/components/Pages/ChartItemSetting'
+import { option } from './config'
+
+const props = defineProps({
+  optionData: {
+    type: Object as PropType<typeof option>,
+    required: true
+  }
+})
+</script>

src/packages/components/Units/Titles/RightBox01/index.ts

@@ -0,0 +1,14 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d';
+import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d';
+
+export const RightBox01Config: ConfigType = {
+  key: 'RightBox01',
+  chartKey: 'VRightBox01',
+  conKey: 'VCRightBox01',
+  title: '六轴感知检测',
+  category: ChatCategoryEnum.TITLE,
+  categoryName: ChatCategoryEnumName.TITLE,
+  package: PackagesCategoryEnum.UNITS,
+  chartFrame: ChartFrameEnum.STATIC,
+  image: 'right1bg.png',
+};

src/packages/components/Units/Titles/RightBox01/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <div  class="go-title-03">
+    <img :width="w" :height="h" src="/src/assets/images/chart/units/right1bg.png" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { PropType, toRefs } from 'vue'
+import { CreateComponentType } from '@/packages/index.d'
+
+const props = defineProps({
+  chartConfig: {
+    type: Object as PropType<CreateComponentType>,
+    required: true
+  }
+})
+
+const { w, h } = toRefs(props.chartConfig.attr)
+const {
+  colors,
+  boxId
+} = toRefs(props.chartConfig.option)
+</script>
+
+<style lang="scss" scoped>
+@include go('title-03') {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center; 
+
+  svg {
+    position: absolute;
+    z-index: -1;
+  }
+  .fill {
+    fill: v-bind('colors[0]');
+  }
+  .fill-none {
+    fill: none;
+  }
+  .stroke {
+    stroke: v-bind('colors[1]');
+  }
+}
+</style>

src/packages/components/Units/Titles/RightBox02/config.ts

@@ -0,0 +1,17 @@
+import { PublicConfigClass } from '@/packages/public'
+import { chartInitConfig } from '@/settings/designSetting'
+import { CreateComponentType } from '@/packages/index.d'
+import { RightBox02Config } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+
+export const option = {
+  boxId: 'RightBox02',
+  colors: ['#06463A','#02221B'],
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType {
+  public key = RightBox02Config.key
+  public attr = { ...chartInitConfig, w: 387, h: 229, zIndex: 1 }
+  public chartConfig = cloneDeep(RightBox02Config)
+  public option = cloneDeep(option)
+}

src/packages/components/Units/Titles/RightBox02/config.vue

@@ -0,0 +1,53 @@
+<template>
+  <CollapseItem name="内容" :expanded="true">
+    <SettingItemBox name="ID" :alone="true">
+      <n-input
+        size="small"
+        v-model:value="optionData.boxId"
+        :minlength="1"
+        type="text"
+        placeholder="请输入Id"
+      />
+    </SettingItemBox> 
+  </CollapseItem>
+  <CollapseItem name="样式" :expanded="true">
+    <SettingItemBox
+      :name="`颜色-${index + 1}`"
+      v-for="(item, index) in optionData.colors"
+      :key="index"
+    >
+      <SettingItem name="颜色">
+        <n-color-picker
+          size="small"
+          :modes="['hex']"
+          v-model:value="optionData.colors[index]"
+        ></n-color-picker>
+      </SettingItem>
+      <SettingItem>
+        <n-button
+          size="small"
+          @click="optionData.colors[index] = option.colors[index]"
+        >
+          恢复默认
+        </n-button>
+      </SettingItem>
+    </SettingItemBox>
+  </CollapseItem>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import {
+  CollapseItem,
+  SettingItemBox,
+  SettingItem
+} from '@/components/Pages/ChartItemSetting'
+import { option } from './config'
+
+const props = defineProps({
+  optionData: {
+    type: Object as PropType<typeof option>,
+    required: true
+  }
+})
+</script>

src/packages/components/Units/Titles/RightBox02/index.ts

@@ -0,0 +1,14 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d';
+import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d';
+
+export const RightBox02Config: ConfigType = {
+  key: 'RightBox02',
+  chartKey: 'VRightBox02',
+  conKey: 'VCRightBox02',
+  title: '三站覆盖面积',
+  category: ChatCategoryEnum.TITLE,
+  categoryName: ChatCategoryEnumName.TITLE,
+  package: PackagesCategoryEnum.UNITS,
+  chartFrame: ChartFrameEnum.STATIC,
+  image: 'right2bg.png',
+};

src/packages/components/Units/Titles/RightBox02/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <div  class="go-title-03">
+    <img :width="w" :height="h" src="/src/assets/images/chart/units/right2bg.png" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { PropType, toRefs } from 'vue'
+import { CreateComponentType } from '@/packages/index.d'
+
+const props = defineProps({
+  chartConfig: {
+    type: Object as PropType<CreateComponentType>,
+    required: true
+  }
+})
+
+const { w, h } = toRefs(props.chartConfig.attr)
+const {
+  colors,
+  boxId
+} = toRefs(props.chartConfig.option)
+</script>
+
+<style lang="scss" scoped>
+@include go('title-03') {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center; 
+
+  svg {
+    position: absolute;
+    z-index: -1;
+  }
+  .fill {
+    fill: v-bind('colors[0]');
+  }
+  .fill-none {
+    fill: none;
+  }
+  .stroke {
+    stroke: v-bind('colors[1]');
+  }
+}
+</style>

src/packages/components/Units/Titles/RightBox03/config.ts

@@ -0,0 +1,17 @@
+import { PublicConfigClass } from '@/packages/public'
+import { chartInitConfig } from '@/settings/designSetting'
+import { CreateComponentType } from '@/packages/index.d'
+import { RightBox03Config } from './index'
+import cloneDeep from 'lodash/cloneDeep'
+
+export const option = {
+  boxId: 'RightBox03',
+  colors: ['#06463A','#02221B'],
+}
+
+export default class Config extends PublicConfigClass implements CreateComponentType {
+  public key = RightBox03Config.key
+  public attr = { ...chartInitConfig, w: 387, h: 229, zIndex: 1 }
+  public chartConfig = cloneDeep(RightBox03Config)
+  public option = cloneDeep(option)
+}

src/packages/components/Units/Titles/RightBox03/config.vue

@@ -0,0 +1,53 @@
+<template>
+  <CollapseItem name="内容" :expanded="true">
+    <SettingItemBox name="ID" :alone="true">
+      <n-input
+        size="small"
+        v-model:value="optionData.boxId"
+        :minlength="1"
+        type="text"
+        placeholder="请输入Id"
+      />
+    </SettingItemBox> 
+  </CollapseItem>
+  <CollapseItem name="样式" :expanded="true">
+    <SettingItemBox
+      :name="`颜色-${index + 1}`"
+      v-for="(item, index) in optionData.colors"
+      :key="index"
+    >
+      <SettingItem name="颜色">
+        <n-color-picker
+          size="small"
+          :modes="['hex']"
+          v-model:value="optionData.colors[index]"
+        ></n-color-picker>
+      </SettingItem>
+      <SettingItem>
+        <n-button
+          size="small"
+          @click="optionData.colors[index] = option.colors[index]"
+        >
+          恢复默认
+        </n-button>
+      </SettingItem>
+    </SettingItemBox>
+  </CollapseItem>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue'
+import {
+  CollapseItem,
+  SettingItemBox,
+  SettingItem
+} from '@/components/Pages/ChartItemSetting'
+import { option } from './config'
+
+const props = defineProps({
+  optionData: {
+    type: Object as PropType<typeof option>,
+    required: true
+  }
+})
+</script>

src/packages/components/Units/Titles/RightBox03/index.ts

@@ -0,0 +1,14 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d';
+import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d';
+
+export const RightBox03Config: ConfigType = {
+  key: 'RightBox03',
+  chartKey: 'VRightBox03',
+  conKey: 'VCRightBox03',
+  title: '双网',
+  category: ChatCategoryEnum.TITLE,
+  categoryName: ChatCategoryEnumName.TITLE,
+  package: PackagesCategoryEnum.UNITS,
+  chartFrame: ChartFrameEnum.STATIC,
+  image: 'right3bg.png',
+};

src/packages/components/Units/Titles/RightBox03/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <div  class="go-title-03">
+    <img :width="w" :height="h" src="/src/assets/images/chart/units/right3bg.png" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { PropType, toRefs } from 'vue'
+import { CreateComponentType } from '@/packages/index.d'
+
+const props = defineProps({
+  chartConfig: {
+    type: Object as PropType<CreateComponentType>,
+    required: true
+  }
+})
+
+const { w, h } = toRefs(props.chartConfig.attr)
+const {
+  colors,
+  boxId
+} = toRefs(props.chartConfig.option)
+</script>
+
+<style lang="scss" scoped>
+@include go('title-03') {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center; 
+
+  svg {
+    position: absolute;
+    z-index: -1;
+  }
+  .fill {
+    fill: v-bind('colors[0]');
+  }
+  .fill-none {
+    fill: none;
+  }
+  .stroke {
+    stroke: v-bind('colors[1]');
+  }
+}
+</style>

src/packages/components/Units/Titles/SearchBox/index.vue

@@ -3,29 +3,29 @@
     <svg :width="w" :height="h">
       <title>编组 41</title>
       <defs>
-          <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
+          <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" :id="`1-${boxId}`">
               <stop :stop-color="colors[0]" offset="0%"></stop>
               <stop :stop-color="colors[1]" stop-opacity="0.206314727" offset="100%"></stop>
           </linearGradient>
-          <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
+          <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" :id="`2-${boxId}`">
               <stop :stop-color="colors[2]" offset="0%"></stop>
               <stop :stop-color="colors[3]" offset="100%"></stop>
           </linearGradient>
           <polygon id="path-3" points="-7.8938096e-15 -3.28814141e-13 11 -3.28814141e-13 13.1616243 1.88067666 2.1616243 1.88067666"></polygon>
-          <filter x="-115.3%" y="-717.8%" width="330.6%" height="1535.7%" filterUnits="objectBoundingBox" id="filter-4">
+          <filter x="-115.3%" y="-717.8%" width="330.6%" height="1535.7%" filterUnits="objectBoundingBox" :id="`4-${boxId}`">
               <feMorphology radius="0.5" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
               <feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
               <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
               <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.462494493   0 0 0 0 0  0 0 0 0.7 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
           </filter>
           <polygon id="path-5" points="15.6938967 4.78840697e-14 26.6938967 4.78840697e-14 28.855521 1.88067666 17.855521 1.88067666"></polygon>
-          <filter x="-115.3%" y="-717.8%" width="330.6%" height="1535.7%" filterUnits="objectBoundingBox" id="filter-6">
+          <filter x="-115.3%" y="-717.8%" width="330.6%" height="1535.7%" filterUnits="objectBoundingBox" :id="`6-${boxId}`">
               <feMorphology radius="0.5" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
               <feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
               <feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
               <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.462494493   0 0 0 0 0  0 0 0 0.7 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
           </filter>
-          <linearGradient x1="50.3209681%" y1="100%" x2="50.3209681%" y2="0.320968094%" id="linearGradient-7">
+          <linearGradient x1="50.3209681%" y1="100%" x2="50.3209681%" y2="0.320968094%" :id="`7-${boxId}`">
               <stop :stop-color="colors[4]" offset="0.00819493007%"></stop>
               <stop :stop-color="colors[5]" offset="100%"></stop>
           </linearGradient>
@@ -34,29 +34,52 @@
           <g id="林业防火-智览-切图版" transform="translate(-460, -92)">
               <g id="全局搜索" transform="translate(460, 92)">
                   <g id="编组-41" transform="translate(0.6886, 0.0542)">
-                      <path d="M0.997855372,50.7938722 L191.268499,50.7938722 L203.480404,39.0576371 L203.480404,0.490133526 C175.182522,0.490133526 155.473471,0.490133526 144.353252,0.490133526 C142.74063,0.490133526 141.927384,0.490133526 139.501517,0.490133526 C100.678123,0.490133526 100.678123,0.490133526 61.8547296,0.490133526 C59.5833877,0.490133526 58.7487514,0.490133526 57.3062013,0.490133526 C57.2171967,0.490133526 57.1258779,0.490133526 57.0317647,0.490133526 C42.0630356,0.490133526 27.1787008,0.490133526 12.3787602,0.490133526 L0.48040407,11.205526 L0.997855372,50.7938722 Z" id="路径-22" stroke="url(#linearGradient-1)" fill-opacity="0.85" :fill="colors[6]"></path>
-                      <g id="编组-5" transform="translate(126.6009, 11.9901) scale(-1, 1) rotate(-180) translate(-126.6009, -11.9901)translate(49.6009, 10.4901)">
-                          <line x1="-3.96190285e-13" y1="1.5" x2="153.992505" y2="1.5" id="路径-6" stroke="url(#linearGradient-2)" opacity="0.399999976"></line>
-                          <path d="M111.756559,3 C112.584986,3 113.256559,2.32842712 113.256559,1.5 C113.256559,0.671572875 112.584986,-5.6600229e-14 111.756559,-5.6600229e-14 C110.928132,-5.6600229e-14 110.256559,0.671572875 110.256559,1.5 C110.256559,2.32842712 110.928132,3 111.756559,3 Z" id="椭圆形" fill="#4A5C4A"></path>
+                    
+                      <path :d="`M0.997855372,${h-2} L${w/1.07},${h-2} L${w-2},${h/1.36} L${w-2},0.490133526 C${w/1.17},0.490133526 
+                        ${w/1.32},0.490133526 ${w/1.42},0.490133526 C${w/1.44},0.490133526 ${w/1.444},0.490133526 ${w/1.47},0.490133526 
+                        C${w/2.04},0.490133526 ${w/2.04},0.490133526 ${w/3.31},0.490133526 C${w/3.44},0.490133526 ${w/3.49},0.490133526 
+                        ${w/3.58},0.490133526 C${w/3.583},0.490133526 ${w/3.589},0.490133526 ${w/3.594},0.490133526 C${w/4.87},0.490133526 
+                        ${w/7.54},0.490133526 ${w/16.56},0.490133526 L0.48040407,${h/4.73} L0.997855372,${h-2} Z`" 
+                        id="路径-22" :stroke="`url(#1-${boxId})`" fill-opacity="0.85" :fill="colors[6]"
+                      ></path>
+                      <!-- <g id="编组-5" transform="translate(126.6009, 11.9901) scale(-1, 1) rotate(-180) translate(-126.6009, -11.9901)translate(49.6009, 10.4901)">
+                          <line :x1="`-3.96190285e-13`" y1="1.5" x2="153.992505" y2="1.5" id="路径-6" :stroke="`url(#2-${boxId})`" opacity="0.399999976"></line>
+                          <path :d="`M${w/1.83},3 C${w/1.82},3 ${w/1.81},2.32842712 ${w/1.81},1.5 C${w/1.81},0.671572875 ${w/1.82},-5.6600229e-14 
+                            ${w/1.83},-5.6600229e-14 C${w/1.85},-5.6600229e-14 ${w/1.86},0.671572875 ${w/1.86},1.5 C${w/1.86},2.32842712 ${w/1.85},3 
+                            ${w/1.83},3 Z`" id="椭圆形" :fill="colors[7]"
+                          ></path>
                           <circle id="椭圆形" :fill="colors[7]" cx="54.7565588" cy="1.5" r="1.5"></circle>
-                      </g>
-                      <g id="黄色棱形" transform="translate(47.3111, 49.8535) scale(1, -1) translate(-47.3111, -49.8535)translate(32.8833, 48.9132)">
+                      </g> -->
+                      
+                      <g id="黄色棱形" :transform="`translate(${w/4.33}, ${h/1.06}) scale(1, -1) translate(-${w/4.33}, -${h/1.06})translate(${w/6.23}, ${h/1.08})`">
                           <g id="矩形">
-                              <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-3"></use>
+                              <use fill="black" fill-opacity="1" :filter="`url(#4-${boxId})`" xlink:href="#path-3"></use>
                               <use :fill="colors[8]" fill-rule="evenodd" xlink:href="#path-3"></use>
                           </g>
                           <g id="矩形" opacity="0.399999976">
-                              <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-5"></use>
+                              <use fill="black" fill-opacity="1" :filter="`url(#6-${boxId})`" xlink:href="#path-5"></use>
                               <use :fill="colors[8]" fill-rule="evenodd" xlink:href="#path-5"></use>
                           </g>
                       </g>
                       <g id="装饰线-">
-                          <polygon id="矩形" :fill="colors[9]" points="33.883293 0.119323339 50.7322536 0.119323339 54.0432648 3.00000034 37.1943042 3.00000034"></polygon>
-                          <polygon id="路径-21" fill="url(#linearGradient-7)" points="0.280015515 23.0451271 0 10.5120201 10.7260003 0.119323339 29.3354202 3.1827193e-13 33.1074945 3.70128702 13.3177491 3.70128702 4.25149047 12.8512446 4.25149047 25.5958812"></polygon>
+                          <polygon 
+                            id="矩形" :fill="colors[9]" 
+                            :points="`${w/6.05} 0.119323339 ${w/4.04} 0.119323339 ${w/3.79} 3.00000034 ${w/5.51} 3.00000034`"
+                          ></polygon>
+                          <polygon 
+                            id="路径-21" :fill="`url(#7-${boxId})`"
+                            :points="`0.280015515 ${h/2.3} 0 ${h/4.94} ${w/19.11} 0.119323339 ${w/6.99} 3.1827193e-13 ${w/6.19} 3.70128702 
+                            ${w/15.39} 3.70128702 4.25149047 ${h/4.12} 4.25149047 ${h/2.07}`"
+                          ></polygon>
                       </g>
-                      <g id="装饰线-" transform="translate(177.0216, 37.7979) scale(-1, -1) translate(-177.0216, -37.7979)translate(150, 25)">
-                          <polygon id="矩形" :fill="colors[9]" points="33.883293 0.119323339 50.7322536 0.119323339 54.0432648 3.00000034 37.1943042 3.00000034"></polygon>
-                          <polygon id="路径-21" fill="url(#linearGradient-7)" points="0.280015515 23.0451271 0 10.5120201 10.7260003 0.119323339 29.3354202 3.1827193e-13 33.1074945 3.70128702 13.3177491 3.70128702 4.25149047 12.8512446 4.25149047 25.5958812"></polygon>
+                      <g id="装饰线-" :transform="`translate(${w/1.16}, ${h/1.34}) scale(-1, -1) translate(-${w/1.16}, -${h/1.4})translate(${w/1.37}, ${h/2.12})`">
+                          <polygon 
+                            id="矩形" :fill="colors[9]" 
+                            :points="`${w/6.05} 0.119323339 ${w/4.04} 0.119323339 ${w/3.79} 3.00000034 ${w/5.51} 3.00000034`"></polygon>
+                          <polygon 
+                            id="路径-21" :fill="`url(#7-${boxId})`" 
+                            :points="`0.280015515 ${h/2.3} 0 ${h/4.94} ${w/19.11} 0.119323339 ${w/6.99} 3.1827193e-13 ${w/6.19} 3.70128702 
+                            ${w/15.39} 3.70128702 4.25149047 ${h/4.12} 4.25149047 ${h/2.07}`"></polygon>
                       </g>
                   </g>
               </g>

src/packages/components/Units/Titles/index.ts

@@ -11,6 +11,9 @@ import { ContentTitle04Config } from './ContentTitle04/index';
 import { ContentTitle05Config } from './ContentTitle05/index';
 import { LeftChartsConfig } from './LeftCharts/index';
 import { SearchBoxConfig } from './SearchBox/index';
+import { RightBox01Config } from './RightBox01/index';
+import { RightBox02Config } from './RightBox02/index';
+import { RightBox03Config } from './RightBox03/index';
 
 export default [
     TopTitlesConfig,
@@ -25,5 +28,8 @@ export default [
     ContentTitle04Config,
     ContentTitle05Config,
     LeftChartsConfig,
-    SearchBoxConfig
+    SearchBoxConfig,
+    RightBox01Config,
+    RightBox02Config,
+    RightBox02Config
 ];