表格调整完毕

packages/bigscreen/designer/components/chartPicker.vue

@@ -7,7 +7,7 @@
         <el-button v-else type="text">选择图表</el-button>
       </template>
       <div class="charts">
-        <div class="item pointer" v-for="tpl in tpls" :key="tpl.type" :class="{selected:selected==tpl.type}"
+        <div class="item pointer" v-for="(tpl,i) in tpls" :key="i" :class="{selected:selected==tpl.type}"
              @click="selected=tpl.type">
           <img :src="tpl.thumb"/>
           <div v-text="tpl.label"/>

packages/bigscreen/designer/components/configExtra.vue

@@ -33,7 +33,24 @@ export default {
   },
   computed: {
     summaryOps: () => Object.keys(AiDvSummary.components).map(e => ({label: e, id: e})),
-  }
+    values: v => v.config?.[v.config?.dataType] || v.config.data
+  },
+  watch: {
+    values: {
+      immediate: true, deep: true,
+      handler() {
+        if (this.config.type === 'AiDvTable') {
+          this.config.config = this.values?.map((v, i) => {
+            return {
+              color: this.config.config?.[i]?.color || '',
+              width: this.config.config?.[i]?.width || '',
+              align: this.config.config?.[i]?.align || '',
+            }
+          })
+        }
+      }
+    }
+  },
 }
 </script>
 
@@ -61,12 +78,12 @@ export default {
       </config-item>
     </template>
     <template v-if="/tabs/.test(config.type)">
-      <group-item v-for="(tab,i) in config.tabs" :key="i" :label="tab.label">
-        <template v-for="(comp,j) in tab.comps">
-          <config-item :label="comp.label">
+      <group-item v-for="(tab,i) in values" :key="i" :label="i">
+        <template v-for="(comp,j) in tab">
+          <config-item :label="comp.name">
             <chart-picker v-model="comp.type" :tpls="layers"/>
           </config-item>
-          <config-extra v-model="tab.comps[j]"/>
+          <config-extra v-model="tab[j]"/>
         </template>
       </group-item>
     </template>