feat(advert): 广告管理页面增删改查

src/views/system/menu/components/Perm.vue

@@ -145,7 +145,7 @@ const {proxy}: any = getCurrentInstance();
 const props = defineProps({
   menuId: {
     type: String,
-    default: undefined
+    default: ''
   },
   menuName: {
     type: String,
@@ -158,7 +158,6 @@ watch(() => props.menuId as any, (newVal, oldVal) => {
   handleQuery()
 })
 
-
 const state = reactive({
   loading: true,
   // 选中ID数组
@@ -182,9 +181,9 @@ const state = reactive({
   formData: {
     id: undefined,
     name: undefined,
-    urlPerm: undefined,
-    btnPerm: undefined,
-    menuId: undefined
+    urlPerm: '',
+    btnPerm: '',
+    menuId: ''
   },
   rules: {
     name: [
@@ -332,8 +331,9 @@ function resetForm() {
   state.formData = {
     id: undefined,
     name: undefined,
-    urlPerm: undefined,
-    btnPerm: undefined
+    urlPerm: '',
+    btnPerm: '',
+    menuId: ''
   }
 }
 

src/views/system/role/components/Role.vue

@@ -1,11 +1,11 @@
 <template>
-  <div>
+  <div class="role-container">
     <!-- 搜索表单 -->
     <el-form
         ref="queryForm"
         :model="queryParams"
-        size="mini"
         :inline="true"
+        size="mini"
     >
       <el-form-item>
         <el-button type="success" :icon="Plus" @click="handleAdd">新增</el-button>
@@ -29,14 +29,14 @@
 
     <!-- 数据表格 -->
     <el-table
-        ref="roleTable"
+        ref="dataTable"
         v-loading="loading"
         :data="pageList"
         @selection-change="handleSelectionChange"
         @row-click="handleRowClick"
-        border
         highlight-current-row
         size="mini"
+        border
     >
       <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="角色名称" prop="name"/>
@@ -118,14 +118,11 @@
 <script setup lang="ts">
 import {listRolesWithPage, updateRole, getRoleDetail, addRole, deleteRoles} from '@/api/system/role'
 import {defineEmits, defineProps, onMounted, reactive, ref, toRefs, unref} from "vue"
-import {add, del, detail, update} from "@api/system/client";
 import {ElForm, ElMessage, ElMessageBox} from "element-plus";
 import {Search, Plus, Edit, Refresh, Delete} from '@element-plus/icons'
 
 const emit = defineEmits(['roleClick'])
-
 const dataForm = ref(ElForm)  // 属性名必须和元素的ref属性值一致
-
 const state = reactive({
   loading: true,
   // 选中ID数组
@@ -162,7 +159,7 @@ const state = reactive({
   }
 })
 
-const {loading,single, multiple, queryParams, pageList, total, dialog, formData, rules} = toRefs(state)
+const {loading, single, multiple, queryParams, pageList, total, dialog, formData, rules} = toRefs(state)
 
 function handleQuery() {
   emit('roleClick', {})
@@ -271,3 +268,9 @@ onMounted(() => {
 })
 
 </script>
+
+<style lang="scss" scoped>
+.role-container {
+  width: 100%;
+}
+</style>