增加AI助手

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>

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,

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,8 +47,7 @@
       </div>
       <div class="layout-middle">
         <div class="canvas-wrapper">
-          <vue-ruler-tool
-              v-model="dashboard.presetLine"
+          <vue-ruler-tool v-model="dashboard.presetLine" v-if="resizeWrapper"
                           class="vueRuler"
                           :step-length="50"
                           parent
@@ -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;

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,7 +508,13 @@ const components = [{
       thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/total.png'
     }]
   }]
-}, {
+},
+  {
+    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',
@@ -689,7 +710,7 @@ const components = [{
         dynamicData: '',
         thumb: 'https://cdn.cunwuyun.cn/dvcp/dv/tpl/video.png'
       }]
-  }]
+    }, customHtml]
   }]
 
 export {components}