feat:表格开关接口整合

web/src/components/table/fieldRender/index.vue

@@ -5,7 +5,7 @@
     <!-- switch -->
     <el-switch
         v-if="field.render == 'switch'"
-        @change="changeField($event, field.render!, property)"
+        @change="changeField($event, property)"
         :model-value="row[property]"
         active-value="1"
         inactive-value="0"
@@ -61,6 +61,10 @@
 <script setup lang="ts">
 import type { TagProps } from 'element-plus'
 import { timeFormat, openUrl } from '/@/components/table'
+import useCurrentInstance from '/@/utils/useCurrentInstance'
+
+const { proxy } = useCurrentInstance()
+
 interface Props {
     row: TableRow
     field: TableColumn
@@ -76,9 +80,15 @@ const props = withDefaults(defineProps<Props>(), {
     property: '',
 })
 
-const changeField = (value: any, type: string, field: keyof TableRow) => {
-    if (type == 'switch') {
-        props.row[field] = value
+const changeField = (value: any, fieldName: keyof TableRow) => {
+    if (props.field.render == 'switch') {
+        props.row[fieldName] = value
+        proxy.eventBus.emit('onTableFieldChange', {
+            value: value,
+            row: props.row,
+            field: fieldName,
+            render: props.field.render,
+        })
     }
 }
 

web/src/views/backend/auth/menu.vue

@@ -121,16 +121,18 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive } from 'vue'
+import { ref, reactive, onBeforeMount, onUnmounted } from 'vue'
 import { actionUrl, index, edit, del, postData } from '/@/api/backend/auth/Menu'
 import { defaultOptButtons } from '/@/components/table'
 import TableHeader from '/@/components/table/header/index.vue'
 import Table from '/@/components/table/index.vue'
 import IconSelector from '/@/components/icon/selector.vue'
 import remoteSelect from '/@/components/remoteSelect/index.vue'
+import useCurrentInstance from '/@/utils/useCurrentInstance'
 import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
+const { proxy } = useCurrentInstance()
 
 /*
  * 表格
@@ -324,7 +326,18 @@ const onAction = (type: string, data: anyObj) => {
     return action!.call(this)
 }
 
-getIndex()
+onBeforeMount(() => {
+    getIndex()
+    proxy.eventBus.on('onTableFieldChange', (data: { value: any; row: TableRow; field: keyof TableRow }) => {
+        postData('edit', {
+            [table.pk]: data.row[table.pk],
+            [data.field]: data.value,
+        })
+    })
+})
+onUnmounted(() => {
+    proxy.eventBus.off('onTableFieldChange')
+})
 </script>
 
 <style lang="scss" scoped>