抽出vue component 控制开关按钮组件

yudao-admin-ui/src/main.js

@@ -37,7 +37,7 @@ import RightToolbar from "@/components/RightToolbar"
 // import hljs from 'highlight.js'
 // import 'highlight.js/styles/github-gist.css'
 import {DICT_TYPE, getDictDataLabel, getDictDatas} from "@/utils/dict";
-
+import { InfConfigKeyEnum } from '@/utils/constants';
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -49,6 +49,7 @@ Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.getDictDatas = getDictDatas
 Vue.prototype.getDictDataLabel = getDictDataLabel
 Vue.prototype.DICT_TYPE = DICT_TYPE
+Vue.prototype.InfConfigKeyEnum = InfConfigKeyEnum
 Vue.prototype.download = download
 Vue.prototype.downloadExcel = downloadExcel
 Vue.prototype.downloadWord = downloadWord

yudao-admin-ui/src/views/infra/apiAccessLog/index.vue

@@ -37,8 +37,10 @@
     <!-- 操作工具栏 -->
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button :type="enable?'info':'primary'" plain :icon="enable?'el-icon-close':'el-icon-check'" size="mini" @click="enableHandler"
-                   v-hasPermi="['infra:api-access-log:export']">{{enable?'关闭日志':'开启日志'}}</el-button>
+        <log-switch :ckey="InfConfigKeyEnum.API_LOG_KEY" 
+        :permissions="['infra:api-access-log:export','infra:api-access-log:asd']"/>
+        <!-- <el-button :type="enable?'info':'primary'" plain :icon="enable?'el-icon-close':'el-icon-check'" size="mini" @click="enableHandler"
+                   v-hasPermi="['infra:api-access-log:export']">{{enable?'关闭日志':'开启日志'}}</el-button> -->
       </el-col>
       <el-col :span="1.5">
         <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
@@ -118,11 +120,11 @@
 
 <script>
 import { getApiAccessLogPage, exportApiAccessLogExcel } from "@/api/infra/apiAccessLog";
-import { getConfigKey,updateValueByKey } from "@/api/infra/config";
-import { InfConfigKeyEnum } from "@/utils/constants";
+import LogSwitch from "@/components/LogSwitch";
 export default {
   name: "ApiAccessLog",
   components: {
+    LogSwitch
   },
   data() {
     return {
@@ -130,8 +132,6 @@ export default {
       loading: true,
       // 显示搜索条件
       showSearch: true,
-      // 是否开启
-      enable: false,
       // 总条数
       total: 0,
       // API 访问日志列表
@@ -157,25 +157,9 @@ export default {
     };
   },
   created() {
-    this.getEnableConfig();
     this.getList();
   },
   methods: {
-    //开启关闭日志
-    enableHandler(){
-        let data = new FormData();
-        data.append("key",InfConfigKeyEnum.API_LOG_KEY);
-        data.append("value",this.enable?false:true);
-        updateValueByKey(data).then(response => {
-           this.msgSuccess(this.enable?"关闭成功":"开启成功");
-           this.getEnableConfig();
-        })
-    },
-    getEnableConfig(){
-        getConfigKey(InfConfigKeyEnum.API_LOG_KEY).then(response => {
-          this.enable = (response.data == "true");
-        })
-    },
     /** 查询列表 */
     getList() {
       this.loading = true;