增加AI助手

2024-01-08 16:36:34 +08:00
parent d7e8fa64fd
commit 6168d5d4b2
4 changed files with 279 additions and 203 deletions
--- a/components/AiAssist.vue
+++ b/components/AiAssist.vue
@@ -0,0 +1,20 @@
+<script>
+export default {
+  name: "AiAssist"
+}
+</script>
+
+<template>
+  <section class="AiAssist">
+    <img src="https://cdn.cunwuyun.cn/dvcp/dv/aiIcon.png"/>
+    <div class="avatar-text" v-text="'全局AI助手'"/>
+  </section>
+</template>
+
+<style scoped lang="scss">
+.AiAssist {
+  .avatar-text {
+    text-align: center;
+  }
+}
+</style>
--- a/components/AiDvRender.vue
+++ b/components/AiDvRender.vue
@@ -60,6 +60,7 @@
      <AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="currentType === 'partyOrg'" :instance="instance"/>
      <!-- <ai-sprite v-else-if="/building/.test(currentType)" v-bind="data" is3D @init="mods[currentType]"/> -->
      <ai-dv-plot v-else-if="currentType=='plot'" :options="data.charts" :instance="instance"/>
+      <ai-assist v-else-if="currentType=='aiAssist'"/>
    </ai-dv-panel>
  </div>
 </template>
@@ -75,6 +76,7 @@ import AiDvDisplay from "./layout/AiDvDisplay/AiDvDisplay";
 import AiDvPanel from "./layout/AiDvPanel/AiDvPanel";
 import AiDvSummary from "./layout/AiDvSummary/AiDvSummary";
 import AiDvPlot from "./layout/AiDvPlot/AiDvPlot.vue";
+import AiAssist from "./AiAssist.vue";

 Vue.use(scrollBoard)

@@ -82,6 +84,7 @@ export default {
  name: 'AiDvRender',
  props: ['data', 'index', 'theme', 'instance'],
  components: {
+    AiAssist,
    AiDvPlot,
    // AiSprite,
    AiDvSummary,
--- a/packages/bigscreen/designer/Layout.vue
+++ b/packages/bigscreen/designer/Layout.vue
@@ -13,8 +13,11 @@
      </div>
    </div>
    <div class="layout-wrapper">
-      <div class="layout-left">
-        <h2>全部资产</h2>
+      <div class="layout-left" :class="{hide:leftHide}">
+        <h2 class="flex">
+          <div class="fill">全部资产</div>
+          <el-button class="leftHideBtn" type="text" @click="leftHide=!leftHide">{{ leftHide ? "展开" : "收起" }}</el-button>
+        </h2>
        <div class="layout-left__wrapper">
          <div class="layout-left__left">
            <div @click="subIndex = 0, parentIndex = index" :class="{active: parentIndex === index}"
@@ -44,14 +47,13 @@
      </div>
      <div class="layout-middle">
        <div class="canvas-wrapper">
-          <vue-ruler-tool
-              v-model="dashboard.presetLine"
-              class="vueRuler"
-              :step-length="50"
-              parent
-              is-scale-revise
-              position="relative"
-              :visible.sync="dashboard.presetLineVisible">
+          <vue-ruler-tool v-model="dashboard.presetLine" v-if="resizeWrapper"
+                          class="vueRuler"
+                          :step-length="50"
+                          parent
+                          is-scale-revise
+                          position="relative"
+                          :visible.sync="dashboard.presetLineVisible">
            <div id="workbench"
                 class="workbench"
                 :style="{
@@ -278,6 +280,8 @@ export default {
      widthScale: 0,
      heightScale: 0,
      images: [],
+      leftHide: false,
+      resizeWrapper: true
    }
  },

@@ -319,7 +323,16 @@ export default {
      this.initCanvas()
    })
  },
-
+  watch: {
+    leftHide: {
+      handler(v) {
+        this.middleWidth = document.querySelector('.layout-wrapper').offsetWidth - (v ? 340 : 670)
+        this.initCanvas()
+        this.resizeWrapper = false
+        this.$nextTick(() => this.resizeWrapper = true)
+      }
+    }
+  },
  methods: {
    ...mapActions(['closePage']),
    copy(link) {
@@ -747,6 +760,22 @@ export default {
    flex-shrink: 0;
    background: #1D2127;

+    &.hide {
+      width: 0;
+      position: relative;
+
+      h2 > .fill {
+        display: none;
+      }
+
+      .leftHideBtn {
+        position: absolute;
+        left: 0;
+        top: 0;
+        transform: translate(0, -100%);
+      }
+    }
+
    & > h2 {
      height: 40px;
      line-height: 40px;
@@ -798,8 +827,12 @@ export default {
        }

        img {
-          width: 180px;
-          height: 80px;
+          width: auto;
+          height: auto;
+          max-height: 80px;
+          max-width: 100%;
+          margin-left: 50%;
+          transform: translateX(-50%);
        }

        span {
@@ -882,7 +915,6 @@ export default {
      position: relative;
      -webkit-transform-origin: 0 0;
      transform-origin: 0 0;
-      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      height: 100%;
      margin: 0;
--- a/packages/bigscreen/designer/config.js
+++ b/packages/bigscreen/designer/config.js
@@ -385,6 +385,21 @@ export const chartTpl = [{
    dynamicData: []
  }]
 }]
+
+const customHtml = {
+  label: "HTML块", type: "html", list: [{
+    type: 'html',
+    label: '自定义HTML',
+    title: '自定义HTML',
+    border: 'border0',
+    width: 500,
+    height: 300,
+    top: 0,
+    left: 0,
+    thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/pie.png',
+    html: `<div style="width: 100%;height: 100%;background: #fff;text-align: center;line-height: 300px;font-size: 20px;color: #000;">自定义HTML</div>`
+  }]
+}
 const components = [{
  type: 'chart', label: '图表', list: [...chartTpl, {
    label: "多维图", type: "plot", list: [{
@@ -493,204 +508,210 @@ const components = [{
      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
    }]
  }]
-}, {
-  type: 'other', label: '其他', list: [{
-    label: '地图', type: 'map', list: [{
-      type: 'map',
-      label: '地图',
-      display: 'map',
-      width: 840,
-      height: 534,
-      left: 0,
-      top: 0,
-      mask: '2',
-      pulseLines: '1',
-      mapStyle: "e51987628aee5206d4c9ca8c6e98b4f7",
-      areaId: '',
-      zIndex: 1,
-      apiData: [],
-      dataType: 'staticData',
-      dynamicData: [],
-      staticData: [{
-        label: '中卫慧通', lng: 117.1339399, lat: 36.7190487,
-      }],
-      api: '',
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png',
-      is3dAround: '0',
-      limitArea: '0',
-      layers: 'vector'
-    }, {
-      type: 'AiDvMap',
-      label: '地图',
-      display: 'map',
-      width: 840,
-      height: 534,
-      left: 0,
-      top: 0,
-      mask: '2',
-      pulseLines: '1',
-      mapStyle: "e51987628aee5206d4c9ca8c6e98b4f7",
-      areaId: '',
-      zIndex: 1,
-      apiData: [],
-      dataType: 'staticData',
-      dynamicData: [],
-      staticData: [{
-        label: '中卫慧通', lng: 117.1339399, lat: 36.7190487,
-      }],
-      api: '',
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png',
-      is3dAround: '0',
-      limitArea: '0',
-    }]
-  }, {
-    label: '党组织', type: 'partyOrg', list: [{
-      type: 'partyOrg',
-      label: '党组织',
-      width: 840,
-      height: 800,
-      zIndex: 1,
-      top: 0,
-      left: 0,
-      dataX: '',
-      dataY: [],
-      title: '党组织',
-      border: 'border3',
-      sourceDataId: '',
-      dataType: 'staticData',
-      staticData: [{
-        key: '个人服务办理', value: 247
+},
+  {
+    label: "AI", list: [
+      {label: "AI助手", list: [{type: "aiAssist", label: "AI助手", width: 134, height: 140, zIndex: 1, title: "AI助手", thumb: "https://cdn.cunwuyun.cn/dvcp/dv/aiIcon.png"}]}
+    ]
+  },
+  {
+    type: 'other', label: '其他', list: [{
+      label: '地图', type: 'map', list: [{
+        type: 'map',
+        label: '地图',
+        display: 'map',
+        width: 840,
+        height: 534,
+        left: 0,
+        top: 0,
+        mask: '2',
+        pulseLines: '1',
+        mapStyle: "e51987628aee5206d4c9ca8c6e98b4f7",
+        areaId: '',
+        zIndex: 1,
+        apiData: [],
+        dataType: 'staticData',
+        dynamicData: [],
+        staticData: [{
+          label: '中卫慧通', lng: 117.1339399, lat: 36.7190487,
+        }],
+        api: '',
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png',
+        is3dAround: '0',
+        limitArea: '0',
+        layers: 'vector'
      }, {
-        key: '同比上月', value: 247
-      }],
-      dynamicData: [],
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
-    }]
-  }, {
-    label: '边框', type: 'panel', list: [{
-      type: 'panel',
-      label: '边框',
-      title: '边框',
-      border: 'border0',
-      width: 400,
-      height: 400,
-      isZoom: false,
-      zIndex: 1,
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/border.png'
-    }]
-  }, {
-    label: '装饰', type: 'display', list: [{
-      type: 'display',
-      label: '装饰',
-      display: 'display0',
-      width: 840,
-      height: 540,
-      isZoom: false,
-      zIndex: 1,
-      title: '标题',
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/display.png',
-      sourceDataId: '',
-      dataType: 'staticData',
-      staticData: [{
-        label: '个人服务办理', value: 247
-      }, {
-        label: '同比上月', value: 247
+        type: 'AiDvMap',
+        label: '地图',
+        display: 'map',
+        width: 840,
+        height: 534,
+        left: 0,
+        top: 0,
+        mask: '2',
+        pulseLines: '1',
+        mapStyle: "e51987628aee5206d4c9ca8c6e98b4f7",
+        areaId: '',
+        zIndex: 1,
+        apiData: [],
+        dataType: 'staticData',
+        dynamicData: [],
+        staticData: [{
+          label: '中卫慧通', lng: 117.1339399, lat: 36.7190487,
+        }],
+        api: '',
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/map.png',
+        is3dAround: '0',
+        limitArea: '0',
      }]
-    }]
-  }, {
-    label: '轮播图', type: 'swiper', list: [{
-      type: 'swiper',
-      label: '轮播图',
-      width: 400,
-      height: 300,
-      zIndex: 1,
-      border: 'border2',
-      dataType: 'staticData',
-      staticData: [{
-        img: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/pie.png', title: '湖羊', content: `歙县众城湖羊养殖专业合作社
-							徐晓红 - 18273645627
-							歙县郑村镇唐跃村碉墅`
-      }],
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png'
    }, {
-      type: 'swiper',
-      label: '轮播图(点指示器)',
-      width: 800,
-      height: 358,
-      zIndex: 1,
-      border: 'border14',
-      dataType: 'staticData',
-      staticData: [{
-        content: `歙县众城湖羊养殖专业合作社
+      label: '党组织', type: 'partyOrg', list: [{
+        type: 'partyOrg',
+        label: '党组织',
+        width: 840,
+        height: 800,
+        zIndex: 1,
+        top: 0,
+        left: 0,
+        dataX: '',
+        dataY: [],
+        title: '党组织',
+        border: 'border3',
+        sourceDataId: '',
+        dataType: 'staticData',
+        staticData: [{
+          key: '个人服务办理', value: 247
+        }, {
+          key: '同比上月', value: 247
+        }],
+        dynamicData: [],
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
+      }]
+    }, {
+      label: '边框', type: 'panel', list: [{
+        type: 'panel',
+        label: '边框',
+        title: '边框',
+        border: 'border0',
+        width: 400,
+        height: 400,
+        isZoom: false,
+        zIndex: 1,
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/border.png'
+      }]
+    }, {
+      label: '装饰', type: 'display', list: [{
+        type: 'display',
+        label: '装饰',
+        display: 'display0',
+        width: 840,
+        height: 540,
+        isZoom: false,
+        zIndex: 1,
+        title: '标题',
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/display.png',
+        sourceDataId: '',
+        dataType: 'staticData',
+        staticData: [{
+          label: '个人服务办理', value: 247
+        }, {
+          label: '同比上月', value: 247
+        }]
+      }]
+    }, {
+      label: '轮播图', type: 'swiper', list: [{
+        type: 'swiper',
+        label: '轮播图',
+        width: 400,
+        height: 300,
+        zIndex: 1,
+        border: 'border2',
+        dataType: 'staticData',
+        staticData: [{
+          img: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/pie.png', title: '湖羊', content: `歙县众城湖羊养殖专业合作社
 							徐晓红 - 18273645627
 							歙县郑村镇唐跃村碉墅`
+        }],
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png'
      }, {
-        content: `歙县众城湖羊养殖专业合作社
+        type: 'swiper',
+        label: '轮播图(点指示器)',
+        width: 800,
+        height: 358,
+        zIndex: 1,
+        border: 'border14',
+        dataType: 'staticData',
+        staticData: [{
+          content: `歙县众城湖羊养殖专业合作社
 							徐晓红 - 18273645627
 							歙县郑村镇唐跃村碉墅`
-      },],
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png',
-      dotIndicator: true
-    }]
-  }, {
-    label: '视频播放器', type: 'video', list: [{
-      type: 'video',
-      label: '视频播放器',
-      width: 400,
-      height: 300,
-      zIndex: 1,
-      src: '',
-      border: 'border2',
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png'
-    }]
-  }, {
-    label: '数据统计', type: 'summary', list: [{
-      type: 'summary',
-      label: '数据统计',
-      display: 'summary0',
-      width: 480,
-      height: 240,
-      zIndex: 1,
-      top: 0,
-      left: 0,
-      dataX: '',
-      dataY: [],
-      summaryTitle: '',
-      border: 'border3',
-      sourceDataId: '',
-      title: '数据统计',
-      dataType: 'staticData',
-      staticData: [{
-        key: '个人服务办理', value: 247
-      }, {
-        key: '同比上月', value: 247
-      }],
-      dynamicData: [],
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
-    }]
-  }, {
-    label: '视频监控', type: 'monitor', list: [{
-      type: 'monitor',
-      label: '视频监控',
-      src: '',
-      width: 480,
-      height: 240,
-      zIndex: 1,
-      top: 0,
-      left: 0,
-      title: '',
-      moniterId: '',
-      monitorType: 'cmcc',
-      api: '/app/appzyvideoequipment/list2',
-      border: 'border2',
-      sourceDataId: '',
-      dataType: 'staticData',
-      staticData: '',
-      dynamicData: '',
-      thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/video.png'
-    }]
+        }, {
+          content: `歙县众城湖羊养殖专业合作社
+							徐晓红 - 18273645627
+							歙县郑村镇唐跃村碉墅`
+        },],
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png',
+        dotIndicator: true
+      }]
+    }, {
+      label: '视频播放器', type: 'video', list: [{
+        type: 'video',
+        label: '视频播放器',
+        width: 400,
+        height: 300,
+        zIndex: 1,
+        src: '',
+        border: 'border2',
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/swiper.png'
+      }]
+    }, {
+      label: '数据统计', type: 'summary', list: [{
+        type: 'summary',
+        label: '数据统计',
+        display: 'summary0',
+        width: 480,
+        height: 240,
+        zIndex: 1,
+        top: 0,
+        left: 0,
+        dataX: '',
+        dataY: [],
+        summaryTitle: '',
+        border: 'border3',
+        sourceDataId: '',
+        title: '数据统计',
+        dataType: 'staticData',
+        staticData: [{
+          key: '个人服务办理', value: 247
+        }, {
+          key: '同比上月', value: 247
+        }],
+        dynamicData: [],
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
+      }]
+    }, {
+      label: '视频监控', type: 'monitor', list: [{
+        type: 'monitor',
+        label: '视频监控',
+        src: '',
+        width: 480,
+        height: 240,
+        zIndex: 1,
+        top: 0,
+        left: 0,
+        title: '',
+        moniterId: '',
+        monitorType: 'cmcc',
+        api: '/app/appzyvideoequipment/list2',
+        border: 'border2',
+        sourceDataId: '',
+        dataType: 'staticData',
+        staticData: '',
+        dynamicData: '',
+        thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/video.png'
+      }]
+    }, customHtml]
  }]
-}]

 export {components}