fix 解决重复调用更新设置接口产生的数据异常

vben28/src/views/admin/settings/Setting.vue

@@ -14,21 +14,15 @@
                     <a-input-number v-model:value="setting.value" :min="1" :max="99999" />
                   </div>
                   <div v-if="setting.type === 'CheckBox'">
-                    <a-checkbox
+                    <a-checkbox :checked="!(setting.value == 'false' || setting.value == false)"
-                      :checked="!(setting.value == 'false' || setting.value == false)"
+                      @update:checked="(val) => (setting.value = val)">
-                      @update:checked="(val) => (setting.value = val)"
-                    >
                     </a-checkbox>
                     {{ setting.description }}
                   </div>
                 </a-form-item>
 
-                <a-button
+                <a-button style="margin-left: 65%" type="primary" :loading="loading"
-                  style="margin-left: 65%"
+                  @click="updateSettingValues(item.settingItemOutput)">{{ t('common.saveText') }}</a-button>
-                  type="primary"
-                  @click="updateSettingValues(item.settingItemOutput)"
-                  >{{ t('common.saveText') }}</a-button
-                >
               </a-form>
             </CollapseContainer>
           </TabPane>
@@ -39,15 +33,15 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, reactive, toRefs, onMounted } from 'vue';
+import { defineComponent, reactive, toRefs, onMounted } from 'vue';
-  import { Tabs } from 'ant-design-vue';
+import { Tabs } from 'ant-design-vue';
-  import { CollapseContainer, ScrollContainer } from '/@/components/Container/index';
+import { CollapseContainer, ScrollContainer } from '/@/components/Container/index';
-  import { SettingOutput, UpdateSettingInput } from '/@/services/ServiceProxies';
+import { SettingOutput, UpdateSettingInput } from '/@/services/ServiceProxies';
-  import { getAllSettingsAsync, updateSettingsAsync } from '/@/views/admin/settings/Setting';
+import { getAllSettingsAsync, updateSettingsAsync } from '/@/views/admin/settings/Setting';
-  import { useI18n } from '/@/hooks/web/useI18n';
+import { useI18n } from '/@/hooks/web/useI18n';
-  import { PageWrapper } from '/@/components/Page';
+import { PageWrapper } from '/@/components/Page';
-  import { message } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
-  export default defineComponent({
+export default defineComponent({
   components: {
     ScrollContainer,
     CollapseContainer,
@@ -79,7 +73,9 @@
           items[prefix + e.name] = String(e.value);
         });
         request.values = items;
+        state.loading = true;
         await updateSettingsAsync({ request });
+        state.loading = false;
         message.success(t('common.operationSuccess'));
       } catch (error) {
         message.success(t('common.operationFail'));
@@ -97,10 +93,10 @@
       updateSettingValues,
     };
   },
-  });
+});
 </script>
 <style lang="less">
-  .account-setting {
+.account-setting {
   margin: 12px;
   background-color: @component-background;
 
@@ -111,5 +107,5 @@
   .ant-tabs-tab-active {
     background-color: @item-active-bg;
   }
-  }
+}
 </style>