Преглед изворни кода

修复页签按钮的BUG。

YangZhiJie пре 1 година
родитељ
комит
89fff4ea61

+ 1 - 1
src/window1/tabGridView/GridBody.vue

@@ -1,6 +1,6 @@
 <template>
   <tr v-if="showTabGridTitleFields" height="40px" :style="{ 'background-color': warningColor }" :class="{ 'warning': isSelected }">
-    <td rowspan="2" class="sticky-col">{{ serialNumber }}</td>
+    <td rowspan="2" class="sticky-col" style="text-align: center;">{{ serialNumber }}</td>
     <td rowspan="2" class="text-center sticky-col" style="left:50px">
       <input v-model="isSelected" autocomplete="off" type="checkbox" @click="clickModelData(modelData)" />
     </td>

+ 93 - 140
src/window1/tabGridView/NewTabButton.vue

@@ -2,64 +2,35 @@
   <div class="button_list">
     <a-space v-if="leftTabButton && leftTabButton.length" size="small">
       <template v-for="(item, index) in leftTabButton" :key="index">
-        <a-button
-          v-if="item.action === 'CREATE'"
-          :icon="h(PlusSquareTwoTone)"
-          @click="create"
-        >
+        <a-button v-if="item.action === 'CREATE'" :icon="h(PlusSquareTwoTone)" @click="create">
           {{ item.name }}
         </a-button>
         <a-button v-else-if="item.action === 'EDIT'" :icon="h(EditTwoTone)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'DELETE'"
-          :icon="h(DeleteTwoTone)"
-          @click="deleteData"
-        >
+        <a-button v-else-if="item.action === 'DELETE'" :icon="h(DeleteTwoTone)" @click="deleteData">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'RUN_PROCESS_REPORT'"
-          :icon="h(ControlTwoTone)"
-          @click="execute(item)"
-        >
+        <a-button v-else-if="item.action === 'RUN_PROCESS_REPORT'" :icon="h(ControlTwoTone)" @click="execute(item)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'OPEN_CUSTOMER_WINDOW'"
-          :icon="h(BookTwoTone)"
-          @click="execute(item)"
-        >
+        <a-button v-else-if="item.action === 'OPEN_CUSTOMER_WINDOW'" :icon="h(BookTwoTone)" @click="execute(item)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'OPEN_HTML_WINDOW'"
-          :icon="h(ContainerTwoTone)"
-          @click="execute(item)"
-        >
+        <a-button v-else-if="item.action === 'OPEN_HTML_WINDOW'" :icon="h(ContainerTwoTone)" @click="execute(item)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'EXPORT'"
-          :icon="h(FileTextTwoTone)"
-          @click="exportConfirm"
-        >
+        <a-button v-else-if="item.action === 'EXPORT'" :icon="h(FileTextTwoTone)" @click="exportConfirm">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'REFRESH'"
-          :icon="h(ReloadOutlined)"
-          @click="refresh"
-        >
+        <a-button v-else-if="item.action === 'REFRESH'" :icon="h(ReloadOutlined)" @click="refresh">
           {{ item.name }}
         </a-button>
         <a-button v-else-if="item.action === 'NOTICE'" :icon="h(BellTwoTone)">
           {{ item.name }}
         </a-button>
         <a-button
-          v-else-if="item.action === 'OPEN_REMOTE_COMPONENT_MODULE_IN_MODAL'"
-          :icon="h(HddOutlined)"
+          v-else-if="item.action === 'OPEN_REMOTE_COMPONENT_MODULE_IN_MODAL'" :icon="h(HddOutlined)"
           @click="openRemoteComponentModule(item)"
         >
           {{ item.name }}
@@ -67,64 +38,49 @@
         <a-button v-else :icon="h(LayoutTwoTone)">{{ item.name }}</a-button>
       </template>
     </a-space>
+    
     <div v-else />
+
+    <a-space size="small">
+      <template v-for="(item, index) in tabButtonsInEveryPage" :key="index">
+        <a-button>
+          {{ item.name }}
+        </a-button>
+      </template>
+    </a-space>
+
+
     <a-space v-if="rightTabButton && rightTabButton.length" size="small">
       <template v-for="(item, index) in rightTabButton" :key="index">
-        <a-button
-          v-if="item.action === 'CREATE'"
-          :icon="h(PlusSquareTwoTone)"
-          @click="create"
-        >
+        <a-button v-if="item.action === 'CREATE'" :icon="h(PlusSquareTwoTone)" @click="create">
           {{ item.name }}
         </a-button>
         <a-button v-else-if="item.action === 'EDIT'" :icon="h(EditTwoTone)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'DELETE'"
-          :icon="h(DeleteTwoTone)"
-          @click="deleteData"
-        >
+        <a-button v-else-if="item.action === 'DELETE'" :icon="h(DeleteTwoTone)" @click="deleteData">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'RUN_PROCESS_REPORT'"
-          :icon="h(ControlTwoTone)"
-        >
+        <a-button v-else-if="item.action === 'RUN_PROCESS_REPORT'" :icon="h(ControlTwoTone)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'OPEN_CUSTOMER_WINDOW'"
-          :icon="h(BookTwoTone)"
-        >
+        <a-button v-else-if="item.action === 'OPEN_CUSTOMER_WINDOW'" :icon="h(BookTwoTone)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'OPEN_HTML_WINDOW'"
-          :icon="h(ContainerTwoTone)"
-        >
+        <a-button v-else-if="item.action === 'OPEN_HTML_WINDOW'" :icon="h(ContainerTwoTone)">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'EXPORT'"
-          :icon="h(FileTextTwoTone)"
-          @click="exportConfirm"
-        >
+        <a-button v-else-if="item.action === 'EXPORT'" :icon="h(FileTextTwoTone)" @click="exportConfirm">
           {{ item.name }}
         </a-button>
-        <a-button
-          v-else-if="item.action === 'REFRESH'"
-          :icon="h(ReloadOutlined)"
-          @click="refresh"
-        >
+        <a-button v-else-if="item.action === 'REFRESH'" :icon="h(ReloadOutlined)" @click="refresh">
           {{ item.name }}
         </a-button>
         <a-button v-else-if="item.action === 'NOTICE'" :icon="h(BellTwoTone)">
           {{ item.name }}
         </a-button>
         <a-button
-          v-else-if="item.action === 'OPEN_REMOTE_COMPONENT_MODULE_IN_MODAL'"
-          :icon="h(HddOutlined)"
+          v-else-if="item.action === 'OPEN_REMOTE_COMPONENT_MODULE_IN_MODAL'" :icon="h(HddOutlined)"
           @click="openRemoteComponentModule(item)"
         >
           {{ item.name }}
@@ -140,21 +96,14 @@
         processReportResult != null &&
           (processReportResult.reportResults != null ||
             processReportResult.processResult != null)
-      "
-      :process-report-result="processReportResult"
-      :pdf-only="false"
-      :excel-only="false"
+      " :process-report-result="processReportResult" :pdf-only="false" :excel-only="false"
     />
     <template #header>
       {{ $t("lang.tabButton.executeResult") }}
     </template>
   </Modal>
 
-  <Modal
-    v-model:show="notificationModal"
-    :show-canel-button="false"
-    :show-ok-button="false"
-  >
+  <Modal v-model:show="notificationModal" :show-canel-button="false" :show-ok-button="false">
     <template #header>
       {{ $t("lang.tabButton.sendNotice") }}
     </template>
@@ -169,12 +118,7 @@
     </template>
   </Modal>
 
-  <component
-    :is="modal1Component"
-    v-model:open="modal1Open"
-    :model-data="selectDatas"
-    @refresh-data="refresh"
-  />
+  <component :is="modal1Component" v-model:open="modal1Open" :model-data="selectDatas" @refresh-data="refresh" />
 </template>
 
 <script setup>
@@ -275,7 +219,8 @@ const emit = defineEmits([
 ]);
 
 const selectDatas = ref([]);
-const tabButtons = ref([]);
+// 在每个界面都显示的页签按钮
+const tabButtonsInEveryPage = ref([]);
 const leftTabButton = ref([]);
 const rightTabButton = ref([]);
 const notificationModal = ref(false);
@@ -471,20 +416,55 @@ const cancelNotification = () => {
   notificationModal.value = false;
 };
 
+
+const tabButtonsHandler = () => {
+  let mapTabButtonDtos = null;
+  if (props.window && props.window.tabs && props.window.tabs.length > 0) {
+    mapTabButtonDtos = JSON.parse(
+      JSON.stringify(props.window.tabs[0].tabGridView.mapTabButtonDtos),
+    );
+    tabButtonsInEveryPage.value = props.window.tabs[0].tabGridView.tabButtons;
+  }
+
+  /**
+   * 左、右两侧的按钮分组
+   */
+  const parseLeftRightButton = function (buttons) {
+    rightTabButton.value = [];
+    leftTabButton.value = [];
+    buttons.forEach(item => {
+      if (item.buttonLocation === 'TABLE_HEADER_RIGHT') {
+        rightTabButton.value.push(item);
+      } else {
+        leftTabButton.value.push(item);
+      }
+    });
+    if (leftTabButton.value.length > 0 || rightTabButton.value.length > 0) {
+      emit('judgeIsHaveButtons', true);
+    }
+    if (leftTabButton.value.length === 0 && rightTabButton.value.length === 0) {
+      emit('judgeIsHaveButtons', false);
+    }
+  };
+
+
+  if (props.nowTab && mapTabButtonDtos) {
+    for (let key in mapTabButtonDtos) {
+      if (key === props.nowTab) {
+        let nowTabButtons = mapTabButtonDtos[key];
+        parseLeftRightButton(nowTabButtons);
+      }
+    }
+  }
+};
+
 // 获取表头按钮分组值,如果没有分组则使用页签按钮
 watch(
   () => props.window,
   newVal => {
     if (newVal.tabs && newVal.tabs.length) {
-      const mapTabButtonDtos = JSON.parse(
-        JSON.stringify(newVal.tabs[0].tabGridView.mapTabButtonDtos),
-      );
-      if (isEmpty(mapTabButtonDtos)) {
-        tabButtons.value = newVal.tabs[0].tabGridView.tabButtons;
-        tabButtonsHandler();
-      } else {
-        tabButtons.value = newVal.tabs[0].tabGridView.mapTabButtonDtos;
-      }
+      console.log('window change...');
+      tabButtonsHandler();
     }
   },
   { deep: true, immediate: true },
@@ -493,42 +473,14 @@ watch(
   () => props.nowTab,
   (newVal, oldVal) => {
     if (newVal !== oldVal) {
-      let nowTabButtons;
-      if (tabButtons.value) {
-        for (let key in tabButtons.value) {
-          if (key === newVal) {
-            nowTabButtons = tabButtons.value[key];
-            tabButtonsHandler(nowTabButtons);
-          }
-        }
-      }
+      console.log('tab change...');
+      tabButtonsHandler();
     }
   },
   { deep: true, immediate: true },
 );
-const tabButtonsHandler = nowTabButtons => {
-  let buttons;
-  if (nowTabButtons) {
-    buttons = JSON.parse(JSON.stringify(nowTabButtons));
-  } else {
-    buttons = JSON.parse(JSON.stringify(tabButtons.value));
-  }
-  rightTabButton.value = [];
-  leftTabButton.value = [];
-  buttons.forEach(item => {
-    if (item.buttonLocation === 'TABLE_HEADER_RIGHT') {
-      rightTabButton.value.push(item);
-    } else {
-      leftTabButton.value.push(item);
-    }
-  });
-  if (leftTabButton.value.length > 0 || rightTabButton.value.length > 0) {
-    emit('judgeIsHaveButtons', true);
-  }
-  if (leftTabButton.value.length === 0 && rightTabButton.value.length === 0) {
-    emit('judgeIsHaveButtons', false);
-  }
-};
+
+
 // 用来判断分组的表头按钮是否有值
 const isEmpty = obj => {
   if (typeof obj !== 'object' || obj === null) {
@@ -788,18 +740,18 @@ const switchFormRoute = async function (tabButton) {
     frameUrl,
     '_blank',
     'height=' +
-      iHeight +
-      ',innerHeight=' +
-      iHeight +
-      ',width=' +
-      iWidth +
-      ',innerWidth=' +
-      iWidth +
-      ',top=' +
-      iTop +
-      ',left=' +
-      iLeft +
-      ',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no',
+    iHeight +
+    ',innerHeight=' +
+    iHeight +
+    ',width=' +
+    iWidth +
+    ',innerWidth=' +
+    iWidth +
+    ',top=' +
+    iTop +
+    ',left=' +
+    iLeft +
+    ',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no',
   );
   // window.open(frameUrl);
 };
@@ -865,6 +817,7 @@ const titleModalClose = async function () {
   align-items: center;
   margin-right: 6px;
 }
+
 .ant-btn {
   padding: 4px 10px;
 }

+ 2 - 2
src/window1/tabGridView/TabGridEdit.vue

@@ -59,7 +59,7 @@
               <table class="curd-table table-striped table-bordered" :width="tableWidth">
                 <thead>
                   <GridHeader
-                    :is-show-edit="!tab.tabDataSource.readOnly" :tab-grid-fields="tabGridFields"
+                    :is-show-edit="false" :tab-grid-fields="tabGridFields"
                     :window-no="windowNo" :tab-index="tabIndex" :is-chinese-english="window.isChineseEnglish"
                     height="40px" @on-sort="onSort($event)" @property-changed="propertyChanged($event)"
                     @select-all="selectAll($event)" @multiple-select="changeSelectMode($event)"
@@ -71,7 +71,7 @@
                       ref="gridBody" :window-no="windowNo" :tab-index="tabIndex" :serial-number="index +
                         1 +
                         (pagination.current_page - 1) * pagination.per_page
-                      " :is-show-edit="!tab.tabDataSource.readOnly" :tab-grid-fields="tabGridFields"
+                      " :is-show-edit="false" :tab-grid-fields="tabGridFields"
                       :tab-grid-title-fields="tabGridTitleFields"
                       :model-data="modelData" 
                       :simple-filter-params="searchText"