Ver código fonte

perfect_binds

ananzhusen 1 ano atrás
pai
commit
b50550ac52
2 arquivos alterados com 84 adições e 60 exclusões
  1. 12 7
      src/services/echarts.ts
  2. 72 53
      src/views/components/PenDatas.vue

+ 12 - 7
src/services/echarts.ts

@@ -70,8 +70,13 @@ export const charts = [
           },
           realTimes: [
             {
-              key: 'echarts.option.series.0.data',
-              label: '数据',
+              key: 'echarts.option.series.0.data.0',
+              label: 'Mon',
+              type: 'object',
+            },
+            {
+              key: 'echarts.option.series.0.data.2',
+              label: 'Wed',
               type: 'object',
             },
             {
@@ -1266,7 +1271,7 @@ export const charts = [
         },
       },
       {
-        name: '双折线图',
+        name: '双柱状图',
         icon: 'l-line-chart',
         data: {
           name: 'echarts',
@@ -1294,12 +1299,12 @@ export const charts = [
               },
               series: [
                 {
-                  type: 'line',
-                  data: [40, 35, 80, 40, 45, 25],
+                  type: 'bar',
+                  data: [40, 20, 90, 60, 70, 80],
                 },
                 {
-                  type: 'line',
-                  data: [25, 40, 20, 30, 25, 40],
+                  type: 'bar',
+                  data: [50, 70, 20, 30, 70, 40],
                 },
               ],
             },

+ 72 - 53
src/views/components/PenDatas.vue

@@ -21,7 +21,7 @@
             <t-icon
               name="link"
               class="hover"
-              :class="{ primary: item.binds?.length }"
+              :class="{ primary: item.binds?.id }"
               @click="onBind(item)"
             />
           </t-tooltip>
@@ -196,15 +196,15 @@
     class="data-link-dialog"
     header="动态数据绑定"
     @close="
-      dataBindDialog.data.binds = dataBindDialog.bkBinds;
-      dataBindDialog.show = false;
+      // dataBindDialog.data.binds = dataBindDialog.bkBinds;
+      dataBindDialog.show = false
     "
     @confirm="dataBindDialog.show = false"
     :width="700"
   >
     <div class="form-item">
       <label>当前绑定:</label>
-      <div class="label" v-if="dataBindDialog.data.binds?.length">
+      <!-- <div class="label" v-if="dataBindDialog.data.binds?.length">
         <t-tooltip
           v-for="(tag, index) in dataBindDialog.data.binds"
           :key="index"
@@ -214,6 +214,13 @@
             {{ tag.label }}
           </t-tag>
         </t-tooltip>
+      </div> -->
+      <div class="label" v-if="dataBindDialog.data.binds?.id">
+        <t-tooltip :content="dataBindDialog.data.binds?.id">
+          <t-tag class="mr-8 mb-8" closable @close="onRemoveBind()">
+            {{ dataBindDialog.data.binds?.label }}
+          </t-tag>
+        </t-tooltip>
       </div>
       <div class="label gray" v-else>无</div>
     </div>
@@ -521,7 +528,7 @@ const dataBindDialog = reactive<any>({
 const dataSetColumns = [
   {
     colKey: 'row-select',
-    type: 'multiple',
+    type: 'single',
     width: 50,
   },
   {
@@ -661,19 +668,25 @@ const onMenuMore = (e: any, item: any, i: number) => {
 };
 
 const onBind = (item: any) => {
-  if (!item.binds) {
-    item.binds = [];
-  }
+  // if (!item.binds) {
+  //   item.binds = [];
+  // }
+  // dataBindDialog.data = item;
+  // dataBindDialog.input = '';
+  // dataBindDialog.selectedIds = [];
+  // for (const i of item.binds) {
+  //   dataBindDialog.selectedIds.push(i.id);
+  // }
+  // dataBindDialog.bkBinds = [];
+  // dataBindDialog.bkBinds.push(...item.binds);
+  // dataBindDialog.show = true;
   dataBindDialog.data = item;
   dataBindDialog.input = '';
   dataBindDialog.selectedIds = [];
-  for (const i of item.binds) {
-    dataBindDialog.selectedIds.push(i.id);
+  if (item.binds && item.binds.id) {
+    dataBindDialog.selectedIds.push(item.binds.id);
   }
-  dataBindDialog.bkBinds = [];
-  dataBindDialog.bkBinds.push(...item.binds);
   dataBindDialog.show = true;
-
   getDataset();
 };
 
@@ -708,59 +721,65 @@ const onChangePagination = (pageInfo: any) => {
 };
 
 const onSelectBindsChange = (value: string[], options: any) => {
-  dataBindDialog.selectedIds = value;
+  // dataBindDialog.selectedIds = value;
 
   if (options.type === 'check') {
-    for (const item of options.selectedRowData) {
-      const found = dataBindDialog.data.binds.findIndex((elem: any) => {
-        return elem.id === item.id;
-      });
-      if (found < 0) {
-        dataBindDialog.data.binds.push(toRaw(item));
-      }
-    }
+    // for (const item of options.selectedRowData) {
+    //   const found = dataBindDialog.data.binds.findIndex((elem: any) => {
+    //     return elem.id === item.id;
+    //   });
+    //   if (found < 0) {
+    //     dataBindDialog.data.binds.push(toRaw(item));
+    //   }
+    // }
+
+    dataBindDialog.selectedIds = value;
+    dataBindDialog.data.binds = toRaw(options.selectedRowData[0]);
   } else if (options.type === 'uncheck') {
-    if (options.currentRowKey === 'CHECK_ALL_BOX') {
-      for (const data of dataBindDialog.dataSet) {
-        const found = dataBindDialog.data.binds.findIndex((elem: any) => {
-          return elem.id === data.id;
-        });
-        if (found > -1) {
-          dataBindDialog.data.binds.splice(found, 1);
-        }
-      }
-    } else {
-      const found = dataBindDialog.data.binds.findIndex((elem: any) => {
-        return elem.id === options.currentRowKey;
-      });
-      if (found > -1) {
-        dataBindDialog.data.binds.splice(found, 1);
-      }
-    }
+    // if (options.currentRowKey === 'CHECK_ALL_BOX') {
+    //   for (const data of dataBindDialog.dataSet) {
+    //     const found = dataBindDialog.data.binds.findIndex((elem: any) => {
+    //       return elem.id === data.id;
+    //     });
+    //     if (found > -1) {
+    //       dataBindDialog.data.binds.splice(found, 1);
+    //     }
+    //   }
+    // } else {
+    //   const found = dataBindDialog.data.binds.findIndex((elem: any) => {
+    //     return elem.id === options.currentRowKey;
+    //   });
+    //   if (found > -1) {
+    //     dataBindDialog.data.binds.splice(found, 1);
+    // }
+    dataBindDialog.selectedIds = [];
+    dataBindDialog.data.binds = {};
+    // }
   }
 };
 
-const onRemoveBind = (index: number) => {
-  dataBindDialog.data.binds.splice(index, 1);
+const onRemoveBind = () => {
+  // dataBindDialog.data.binds.splice(index, 1);
 
   dataBindDialog.selectedIds = [];
-  for (const i of dataBindDialog.data.binds) {
-    dataBindDialog.selectedIds.push(i.id);
-  }
+  // for (const i of dataBindDialog.data.binds) {
+  //   dataBindDialog.selectedIds.push(i.id);
+  // }
+  dataBindDialog.data.binds = undefined;
 };
 
 const getBindsDesc = (item: any) => {
-  if (!item.binds || !item.binds.length) {
+  if (!item.binds || !item.binds.id) {
     return '绑定动态数据';
   }
-  let desc = '';
-  for (const i of item.binds) {
-    desc += i.label + ',';
-  }
-  if (desc && desc.length > 1) {
-    desc = desc.substring(0, desc.length - 1);
-  }
-  return desc;
+  // let desc = '';
+  // for (const i of item.binds) {
+  //   desc += i.label + ',';
+  // }
+  // if (desc && desc.length > 1) {
+  //   desc = desc.substring(0, desc.length - 1);
+  // }
+  return item.binds.label;
 };
 
 const changeValue = (prop: string) => {