优化大屏组件

project/dvui/components/AiDvRender.vue

@@ -15,131 +15,19 @@
           :key="data.height"
           :theme="theme"
           :style="{height: data.height + 'px', width: '100%'}"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart1'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart2'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :theme="theme"
-          :key="`chart${index}`"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart3'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart5'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart7'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart8'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'barChart9'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'lineChart1'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="lineChart1"/>
-      <ai-echart
-          v-else-if="data.type === 'lineChart2'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="lineChart2"/>
-      <ai-echart
-          v-else-if="data.type === 'lineChart3'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'lineChart4'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="data.config"/>
-      <ai-echart
-          v-else-if="data.type === 'lineChart5'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="lineChart5"/>
-      <ai-echart
-          v-else-if="data.type === 'pieChart'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="pieChart"/>
-      <ai-echart
-          v-else-if="data.type === 'pieChart1'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="pieChart1"/>
-      <ai-echart
-          v-else-if="data.type === 'pieChart3'"
-          style="height: 100%; width: 100%;"
-          :ref="'chart' + index"
-          :key="`chart${index}`"
-          :theme="theme"
-          :data="values"
-          :ops="pieChart3"/>
+      <ai-echart v-else-if="/Chart/.test(data.type)"
+                 style="height: 100%; width: 100%;"
+                 :ref="'chart' + index"
+                 :key="`chart${index}`"
+                 :theme="theme"
+                 :data="values"
+                 :ops="chartList[data.config]"/>
       <ai-map :markers="values" v-else-if="data.type=='map'" :mask="data.mask === '1'" :areaId="data.areaId || user.info.areaId"
               :map-style="`amap://styles/${data.mapStyle}`" :pulseLines="data.pulseLines==1" :map.sync="map" :lib.sync="lib"/>
       <ai-monitor :src="data.src" v-else-if="data.type === 'monitor'" :type="data.monitorType"/>
       <video style="width: 100%; height: 100%; object-fit: fill;" loop :src="data.src" autoplay v-else-if="data.type === 'video'"/>
       <AiDvPartyOrg style="width: 100%; height: 100%;" v-else-if="data.type === 'partyOrg'" :instance="instance"/>
+      <ai-sprite v-else-if="/building/.test(data.type)" v-bind="data" is3D @init="mods[data.type]"/>
     </ai-dv-panel>
   </div>
 </template>
@@ -147,54 +35,44 @@
 <script>
 import {mapState} from 'vuex'
 import AiSwiper from './AiSwiper.vue'
-import pieChart from './AiEchart/template/pie/pieChart2'
-import pieChart1 from './AiEchart/template/pie/pieChart1'
-import pieChart3 from './AiEchart/template/pie/pieChart3'
-import lineChart1 from './AiEchart/template/line/lineChart1'
-import lineChart2 from './AiEchart/template/line/lineChart2'
-import lineChart5 from './AiEchart/template/line/lineChart5'
+import chartList from './AiEchart/echartTpls'
 import AiMonitor from "./AiMonitor/AiMonitor";
 import AiDvPanel from "../layout/AiDvPanel/AiDvPanel";
 import AiDvDisplay from "../layout/AiDvDisplay/AiDvDisplay";
 import AiDvSummary from "../layout/AiDvSummary/AiDvSummary";
+import AiSprite from "./AiSprite";
+import * as mods from "./AiSprite/mods";
 
 
 export default {
   name: 'AiDvRender',
   props: ['data', 'index', 'theme', 'instance'],
   components: {
+    AiSprite,
     AiDvSummary,
     AiDvDisplay,
     AiDvPanel,
     AiMonitor,
     AiSwiper
   },
-
   data() {
     return {
-      lineChart1,
-      lineChart2,
-      lineChart5,
-      pieChart,
-      pieChart1,
-      pieChart3,
+      mods,
+      chartList,
       map: null,
       lib: null
     }
   },
-
   computed: {
     ...mapState(['user']),
-
     values() {
       if (!this.data) {
         return []
       }
-
       return this.data.type === 'map' ? this.data[this.data.dataType].map(e => {
         return {...e, lng: e['经度'], lat: e['纬度'], label: e['地区名称']}
       }) : this.data[this.data.dataType]
-    }
+    },
   },
   methods: {
     formatTable(data, isShowIndex, rowNum) {

project/dvui/components/AiEchart/echartTpls.js

@@ -0,0 +1,35 @@
+import barChart1 from "./template/bar/barChart1"
+import barChart2 from "./template/bar/barChart2"
+import barChart3 from "./template/bar/barChart3"
+import barChart5 from "./template/bar/barChart5"
+import barChart7 from "./template/bar/barChart7"
+import barChart8 from "./template/bar/barChart8"
+import barChart9 from "./template/bar/barChart9"
+
+import lineChart1 from "./template/line/lineChart1"
+import lineChart2 from "./template/line/lineChart2"
+import lineChart3 from "./template/line/lineChart3"
+import lineChart4 from "./template/line/lineChart4"
+import lineChart5 from "./template/line/lineChart5"
+
+import pieChart1 from "./template/pie/pieChart1"
+import pieChart2 from "./template/pie/pieChart2"
+import pieChart3 from "./template/pie/pieChart3"
+
+export default {
+  barChart1,
+  barChart2,
+  barChart3,
+  barChart5,
+  barChart7,
+  barChart8,
+  barChart9,
+  lineChart1,
+  lineChart2,
+  lineChart3,
+  lineChart4,
+  lineChart5,
+  pieChart1,
+  pieChart2,
+  pieChart3
+}

project/dvui/components/AiSprite/building/building1.js

@@ -0,0 +1,4 @@
+const initModel = () => {
+
+}
+export default initModel

project/dvui/components/AiSprite/mods.js

@@ -0,0 +1 @@
+export const building1 = import('./building/building1')