feat: permissions

resources/admin/components/admin/paginate/index.vue

@@ -1,29 +1,17 @@
 <template>
-<div class="pt-2 pb-2 flex justify-end">
-    <el-pagination
-        background
-        :layout="layout"
-        :current-page="page"
-        :page-size="limit"
-        @current-change="changePage"
-        @size-change="changeLimit"
-        :total="total"
-        :page-sizes="pageSizes"
-    />
-</div>
+  <div class="flex justify-end pt-5">
+    <el-pagination background :layout="layout" :current-page="page" :page-size="limit" @current-change="changePage" @size-change="changeLimit" :total="total" :page-sizes="pageSizes" />
+  </div>
 </template>
 
 <script lang="ts" setup>
-
-import {inject} from "vue";
+import { inject } from 'vue'
 
 const layout = 'total,sizes,prev, pager,next'
 
 const pageSizes = [10, 20, 30, 50]
 
-const {page, limit, total, changePage, changeLimit} = inject('paginate')
+const { page, limit, total, changePage, changeLimit } = inject('paginate')
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

resources/admin/components/admin/status/index.vue

@@ -5,7 +5,6 @@
 <script lang="ts" setup>
 import { useEnabled } from '/admin/composables/curd/useEnabled'
 import { Status } from '/admin/enum/app'
-import { watch } from 'vue'
 
 const props = defineProps({
   modelValue: Boolean | Number | String,
@@ -13,12 +12,15 @@ const props = defineProps({
   id: Number | String,
 })
 
-const emits = defineEmits(['update:modelValue'])
+const emits = defineEmits(['update:modelValue', 'refresh'])
 
-const { enabled, success, loading } = useEnabled()
+const { enabled, success, loading, afterEnabled } = useEnabled()
 
-watch(success, function () {
+success(() => {
   emits('update:modelValue', props.modelValue === Status.ENABLE ? Status.DISABLE : Status.ENABLE)
-  success.value = false
 })
+
+afterEnabled.value = () => {
+  emits('refresh')
+}
 </script>

resources/admin/components/admin/table/operate.vue

@@ -1,21 +1,17 @@
 <template>
-    <div class="pt-5 pl-2">
-        <Add @click="show(showParams)" />
-        <slot name="operate"/>
-    </div>
+  <div class="pt-5 pl-2">
+    <Add @click="show(showParams)" />
+    <slot name="operate" />
+  </div>
 </template>
 
 <script lang="ts" setup>
 defineProps({
-    show: {
-        type: Function,
-        required: true,
-    },
+  show: {
+    type: Function,
+    required: true,
+  },
 
-    showParams: null
+  showParams: null,
 })
 </script>
-
-<style scoped>
-
-</style>

resources/admin/composables/curd/useCreate.ts

@@ -1,5 +1,5 @@
 import http from '/admin/support/http'
-import { ref, unref } from 'vue'
+import { ref, unref, watch } from 'vue'
 import { Code } from '/admin/enum/app'
 import Message from '/admin/support/message'
 import { FormInstance } from 'element-plus'
@@ -64,5 +64,13 @@ export function useCreate(path: string, id: string | number | null = null, _form
       .then(() => {})
   }
 
-  return { formData, loading, form, submitForm, isClose, beforeCreate, beforeUpdate }
+  const close = (func: Function) => {
+    watch(isClose, function (value) {
+      if (value && isFunction(func)) {
+        func()
+      }
+    })
+  }
+
+  return { formData, loading, form, submitForm, close, beforeCreate, beforeUpdate }
 }

resources/admin/composables/curd/useEnabled.ts

@@ -1,19 +1,24 @@
 import http from '/admin/support/http'
 import { Code } from '/admin/assets/enum/app'
 import Message from '/admin/support/message'
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
+import { isFunction } from '/admin/support/helper'
 
 export function useEnabled() {
-  const success = ref(false)
+  const isSuccess = ref(false)
   const loading = ref<boolean>(false)
+  const afterEnabled = ref()
   function enabled(path: string, id: string | number, data: object = {}) {
     loading.value = true
     http
       .put(path + '/enable/' + id, data)
       .then(r => {
         if (r.data.code === Code.SUCCESS) {
-          success.value = true
+          isSuccess.value = true
           Message.success(r.data.message)
+          if (isFunction(afterEnabled.value)) {
+            afterEnabled.value()
+          }
         } else {
           Message.error(r.data.message)
         }
@@ -23,5 +28,12 @@ export function useEnabled() {
       })
   }
 
-  return { enabled, success, loading }
+  const success = (func: Function) => {
+    watch(isSuccess, function () {
+      isSuccess.value = false
+      func()
+    })
+  }
+
+  return { enabled, success, loading, afterEnabled }
 }

resources/admin/composables/curd/useOpen.ts

@@ -0,0 +1,21 @@
+import { ref } from 'vue'
+import { t } from '/admin/support/helper'
+
+const visible = ref<boolean>(false)
+const id = ref(null)
+const title = ref<string>('')
+export function useOpen() {
+  const open = (primary: any) => {
+    console.log(primary)
+    title.value = primary ? t('system.edit') : t('system.add')
+    id.value = primary
+    visible.value = true
+  }
+
+  const close = (func: Function) => {
+    visible.value = false
+    func()
+  }
+
+  return { open, close, title, visible, id }
+}

resources/admin/composables/curd/useShow.ts

@@ -1,14 +1,26 @@
 import http from '/admin/support/http'
+import { Ref, ref } from 'vue'
+import { isFunction } from '../../support/helper'
 
-export function useShow(path: string, id: string | number) {
-  return new Promise((resolve, reject) => {
-    http
-      .get(path + '/' + id)
-      .then(response => {
-        resolve(response.data)
-      })
-      .catch(e => {
-        reject(e)
-      })
+const loading = ref<boolean>(true)
+
+const data = ref<object>()
+
+// 后置钩子
+const afterShow = ref()
+
+export function useShow(path: string, id: string | number, fillData: null | Ref = null) {
+  http.get(path + '/' + id).then(r => {
+    loading.value = false
+    data.value = r.data.data
+    if (fillData) {
+      fillData.value = r.data.data
+
+      if (isFunction(afterShow.value)) {
+        afterShow.value(fillData)
+      }
+    }
   })
+
+  return { data, loading, afterShow }
 }

resources/admin/layout/components/header/index.vue

@@ -28,7 +28,7 @@
 <script setup lang="ts">
 import { useAppStore } from '/admin/stores/modules/app'
 import Notification from './notification.vue'
-import MenuSearch from './menuSearch.vue.vue'
+import MenuSearch from './menuSearch.vue'
 
 const store = useAppStore()
 </script>