修改文章审核流程

增加文章和栏目的预览链接
修改权限管理的报错

src/api/article.js

@@ -91,9 +91,9 @@ export const submitArticle = (data) => {
 // @Produce  application/json
 // @Param menu Object
 // @Router /cms/article/review [put]
-export const reviewArticle = (data) => {
+export const reviewBackArticle = (data) => {
   return service({
-    url: '/cms/article/review',
+    url: '/cms/article/reviewBack',
     method: 'put',
     data
   })

src/api/fetcher.js

@@ -11,12 +11,12 @@ export const getFetcherArticleList = (data) => {
   })
 }
 
-// @Summary 根据id获取文章
+// @Summary 根据id导入文章
 // @accept application/json
-// @Router /cms/fetcher/getArticle [get]
+// @Router /cms/fetcher/importArticle [get]
-export const getFetcherArticleById = (params) => {
+export const importFetcherArticleById = (params) => {
   return service({
-    url: '/cms/fetcher/getArticle',
+    url: '/cms/fetcher/importArticle',
     method: 'get',
     params
   })

src/view/content/article/index.vue

@@ -41,17 +41,19 @@
     <div class="gva-table-box">
       <div class="gva-btn-list">
         <el-button type="primary" icon="plus" @click="handleAdd('0')">新增文章</el-button>
-        <el-button icon="delete" style="margin-left: 10px;" :disabled="!multipleSelection.length"
+        <el-button v-auth="btnAuth.delete" icon="delete" style="margin-left: 10px;"
-          @click="handleMultiDelete">删除</el-button>
+          :disabled="!multipleSelection.length" @click="handleMultiDelete">删除</el-button>
       </div>
 
       <!-- 由于此处菜单跟左侧列表一一对应所以不需要分页 pageSize默认999 -->
       <el-table ref="multipleTable" :data="tableData" row-key="ID" @selection-change="handleSelectionChange">
         <el-table-column fixed type="selection" width="40" align="center" />
         <el-table-column align="left" label="ID" min-width="60" prop="ID" />
-        <el-table-column align="left" label="标题/副标题" min-width="270" prop="title">
+        <el-table-column align="left" label="标题/副标题" min-width="350" prop="title">
           <template #default="scope">
+            <el-link type="primary" :href="'http://w1.zkzk.org.cn/article/' + scope.row.ID + '.html'" target="_blank">
               {{ scope.row.title }}
+            </el-link>
             <div><small>{{ scope.row.subtitle }}</small></div>
           </template>
         </el-table-column>
@@ -102,21 +104,30 @@
         <el-table-column align="left" fixed="right" label="操作" width="140">
           <template #default="scope">
             <div class="flex md-2">
-              <el-button type="primary" link icon="memo" @click="handleRowPreview(scope.row)">预览</el-button>
+              <el-button v-if="scope.row.status === 1" v-auth="btnAuth.submit" type="success" link icon="check"
-              <el-button v-if="scope.row.status === 1" type="success" link icon="check"
                 @click="handleRowChange(scope.row, 2)">提审</el-button>
-              <el-button v-if="scope.row.status === 2" type="primary" link icon="WindPower"
+            </div>
+            <div class="flex md-2">
+              <el-button v-if="scope.row.status === 2" v-auth="btnAuth.review" type="primary" link icon="WindPower"
                 @click="handleRowReview(scope.row)">审核</el-button>
-              <el-button v-if="scope.row.status === 3" type="success" link icon="top"
+            </div>
+            <div class="flex md-2">
+              <el-button v-if="scope.row.status === 3" v-auth="btnAuth.release" type="success" link icon="top"
                 @click="handleRowChange(scope.row, 4)">发布</el-button>
-              <el-button v-if="scope.row.status === 4" type="warning" link icon="bottom"
+            </div>
+            <div class="flex md-2">
+              <el-button v-if="scope.row.status === 4" v-auth="btnAuth.cancel" type="warning" link icon="bottom"
                 @click="handleRowChange(scope.row, 5)">撤销</el-button>
             </div>
-            <div class="flex">
+            <div class="flex md-2">
-              <el-button :type="scope.row.status === 1 || scope.row.status === 5 ? 'primary' : 'info'" link icon="edit"
+              <el-button v-auth="btnAuth.edit"
+                :type="scope.row.status === 1 || scope.row.status === 5 ? 'primary' : 'info'" link icon="edit"
                 :disabled="scope.row.status === 4 || scope.row.status === 2"
                 @click="handleRowEdit(scope.row.ID)">编辑</el-button>
-              <el-button type="danger" link icon="delete" @click="handleRowDelete(scope.row.ID)">删除</el-button>
+            </div>
+            <div class="flex md-2">
+              <el-button v-auth="btnAuth.delete" type="danger" link icon="delete"
+                @click="handleRowDelete(scope.row.ID)">删除</el-button>
             </div>
           </template>
         </el-table-column>
@@ -148,12 +159,13 @@ import {
   setArticleChannels,
   setArticleCategories,
   submitArticle,
-  reviewArticle,
+  reviewBackArticle,
   releaseArticle,
   cancelArticle
 } from '@/api/article'
 import ArticleEdit from '@/view/content/components/articleEdit.vue'
-
+import { useBtnAuth } from '@/utils/btnAuth'
+const btnAuth = useBtnAuth()
 const articleEditTitle = ref('')
 const articleEditRef = ref(false)
 const page = ref(1)
@@ -359,23 +371,23 @@ const handleRowReview = row => {
     cancelButtonText: '否',
     type: 'warning'
   }).then(async valid => {
-    // 确认通过，状态为待发布
+    // 确认通过，发布文章
-    const res = await reviewArticle({ ID: row.ID, status: 3 })
+    const res = await releaseArticle({ ID: row.ID })
     if (res.code === 0) {
       ElMessage({
         type: 'success',
-        message: '审核确认通过!'
+        message: '审核通过!'
       })
-      row.status = 3
+      row.status = 4
     }
   }).catch(async (action) => {
-    // 确认不通过，状态为待提审
+    // 确认不通过，状态为草稿
     if (action === 'cancel') {
-      const res = await reviewArticle({ ID: row.ID, status: 1 })
+      const res = await reviewBackArticle({ ID: row.ID })
       if (res.code === 0) {
         ElMessage({
           type: 'warning',
-          message: '审核确认不通过!'
+          message: '审核不通过!'
         })
         row.status = 1
       }
@@ -383,14 +395,6 @@ const handleRowReview = row => {
   })
 }
 
-// 预览
-const handleRowPreview = (row) => {
-  ElMessage({
-    type: 'warning',
-    message: '开发中。。。'
-  })
-}
-
 // ----- 列表更新栏目相关 -----
 const handleChangeChannels = async row => {
   await nextTick()

src/view/content/channel/index.vue

@@ -10,6 +10,12 @@
         <el-table-column align="left" label="ID" min-width="80" prop="ID" />
         <el-table-column align="left" label="名称" min-width="100" prop="name" />
         <el-table-column align="left" label="标题" min-width="120" prop="title" />
+        <el-table-column align="left" label="预览" min-width="120" prop="preview">
+          <template #default="scope">
+            <el-link type="primary" :href="'http://w1.zkzk.org.cn/channel/' + scope.row.ID + '.htm'"
+              target="_blank">预览</el-link>
+          </template>
+        </el-table-column>
         <el-table-column align="left" label="摘要" min-width="260" prop="description" />
         <el-table-column align="left" label="关键词" min-width="260" prop="keyword" />
         <el-table-column align="left" label="介绍" min-width="260" prop="introduce" />
@@ -96,12 +102,12 @@
         </div>
         <el-form-item label="栏目模板" prop="channelTplId" style="width: 88%">
           <el-select v-model="form.channelTplId" placeholder="请选择" style="width: 240px">
-            <el-option v-for="item in channelTplOptions" :key="item.ID" :label="item.title" :value="item.ID" />
+            <el-option v-for="item in channelTplOptions" :key="item.ID" :label="item.name" :value="item.ID" />
           </el-select>
         </el-form-item>
         <el-form-item label="文章页模板" prop="articleTplId" style="width: 88%">
           <el-select v-model="form.articleTplId" placeholder="请选择" style="width: 240px">
-            <el-option v-for="item in articleTplOptions" :key="item.ID" :label="item.title" :value="item.ID" />
+            <el-option v-for="item in articleTplOptions" :key="item.ID" :label="item.name" :value="item.ID" />
           </el-select>
         </el-form-item>
       </el-form>

src/view/content/components/articleEdit.vue

@@ -55,7 +55,9 @@
                 </el-col>
               </el-row>
               <el-form-item label="文章内容" prop="content">
+                <div v-if="showDrawer">
                   <RichEdit v-model="editForm.content" style="height: 50rem;" />
+                </div>
               </el-form-item>
             </el-col>
             <el-col :span="1" align="center">
@@ -151,7 +153,7 @@ import {
   updateArticle,
   getArticleById,
 } from '@/api/article'
-import { getFetcherArticleById } from '@/api/fetcher'
+import { importFetcherArticleById } from '@/api/fetcher'
 
 // 组件定义
 defineOptions({
@@ -348,7 +350,7 @@ const initFormByArticle = async (id) => {
 
 // 从爬虫数据中获取内容并填充至文章内容中
 const initFormByFetcher = async (id) => {
-  const res = await getFetcherArticleById({ ID: id })
+  const res = await importFetcherArticleById({ ID: id })
   if (res.code === 0 && res.data && res.data.article) {
     fetcherArticleId.value = id
     const { title, author, source, content, publicTime } = res.data.article

src/view/content/fetcher/article.vue

@@ -121,6 +121,7 @@ const initSearchInfo = () => {
       formatTimeToStr(startDate, 'yyyy-MM-dd'),
       formatTimeToStr(endDate, 'yyyy-MM-dd'),
     ],
+    state: 0,
   }
 }
 
@@ -162,8 +163,7 @@ const handleRowEdit = (ID) => {
 
 // ----- 查询 -----
 const getTableData = async () => {
-  const state = 0
+  const res = await getFetcherArticleList({ page: page.value, pageSize: pageSize.value, ...searchInfo.value })
-  const res = await getFetcherArticleList({ page: page.value, pageSize: pageSize.value, ...searchInfo.value, state })
   if (res.code === 0) {
     tableData.value = res.data.list
     total.value = res.data.total

src/view/layout/aside/index.vue

@@ -105,7 +105,6 @@ const selectMenuItem = (index, _, ele, aaa) => {
   if (index.indexOf('http://') > -1 || index.indexOf('https://') > -1) {
     window.open(index)
   } else {
-    console.log(index, query, params)
     router.push({ name: index, query, params })
   }
 }

src/view/superAdmin/api/api.vue

@@ -1,121 +1,45 @@
 <template>
   <div>
     <div class="gva-search-box">
-      <el-form
+      <el-form ref="searchForm" :inline="true" :model="searchInfo" label-width="auto">
-        ref="searchForm"
-        :inline="true"
-        :model="searchInfo"
-      >
         <el-form-item label="路径">
-          <el-input
+          <el-input v-model="searchInfo.path" placeholder="路径" />
-            v-model="searchInfo.path"
-            placeholder="路径"
-          />
         </el-form-item>
         <el-form-item label="描述">
-          <el-input
+          <el-input v-model="searchInfo.description" placeholder="描述" />
-            v-model="searchInfo.description"
-            placeholder="描述"
-          />
         </el-form-item>
         <el-form-item label="API组">
-          <el-input
+          <el-input v-model="searchInfo.apiGroup" placeholder="api组" />
-            v-model="searchInfo.apiGroup"
-            placeholder="api组"
-          />
         </el-form-item>
         <el-form-item label="请求">
-          <el-select
+          <el-select v-model="searchInfo.method" clearable placeholder="请选择">
-            v-model="searchInfo.method"
+            <el-option v-for="item in methodOptions" :key="item.value" :label="`${item.label}(${item.value})`"
-            clearable
+              :value="item.value" />
-            placeholder="请选择"
-          >
-            <el-option
-              v-for="item in methodOptions"
-              :key="item.value"
-              :label="`${item.label}(${item.value})`"
-              :value="item.value"
-            />
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button
+          <el-button type="primary" icon="search" @click="onSubmit">查询</el-button>
-            type="primary"
+          <el-button icon="refresh" @click="onReset">重置</el-button>
-            icon="search"
-            @click="onSubmit"
-          >查询</el-button>
-          <el-button
-            icon="refresh"
-            @click="onReset"
-          >重置</el-button>
         </el-form-item>
       </el-form>
     </div>
     <div class="gva-table-box">
       <div class="gva-btn-list">
-        <el-button
+        <el-button type="primary" icon="plus" @click="openDialog('addApi')">新增</el-button>
-          type="primary"
+        <el-icon class="cursor-pointer"
-          icon="plus"
+          @click="toDoc('https://www.bilibili.com/video/BV1kv4y1g7nT?p=7&vd_source=f2640257c21e3b547a790461ed94875e')">
-          @click="openDialog('addApi')"
+          <VideoCameraFilled />
-        >新增</el-button>
+        </el-icon>
-        <el-icon
+        <el-button icon="delete" :disabled="!apis.length" @click="onDelete">删除</el-button>
-          class="cursor-pointer"
+        <el-button icon="Refresh" @click="onFresh">刷新缓存</el-button>
-          @click="toDoc('https://www.bilibili.com/video/BV1kv4y1g7nT?p=7&vd_source=f2640257c21e3b547a790461ed94875e')"
-        ><VideoCameraFilled /></el-icon>
-        <el-button
-          icon="delete"
-          :disabled="!apis.length"
-          @click="onDelete"
-        >删除</el-button>
-        <el-button
-          icon="Refresh"
-          @click="onFresh"
-        >刷新缓存</el-button>
       </div>
-      <el-table
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
-        :data="tableData"
+        <el-table-column type="selection" width="55" />
-        @sort-change="sortChange"
+        <el-table-column align="left" label="id" min-width="60" prop="ID" sortable="custom" />
-        @selection-change="handleSelectionChange"
+        <el-table-column align="left" label="API路径" min-width="200" prop="path" sortable="custom" />
-      >
+        <el-table-column align="left" label="API分组" min-width="150" prop="apiGroup" sortable="custom" />
-        <el-table-column
+        <el-table-column align="left" label="API简介" min-width="150" prop="description" sortable="custom" />
-          type="selection"
+        <el-table-column align="left" label="请求" min-width="150" prop="method" sortable="custom">
-          width="55"
-        />
-        <el-table-column
-          align="left"
-          label="id"
-          min-width="60"
-          prop="ID"
-          sortable="custom"
-        />
-        <el-table-column
-          align="left"
-          label="API路径"
-          min-width="150"
-          prop="path"
-          sortable="custom"
-        />
-        <el-table-column
-          align="left"
-          label="API分组"
-          min-width="150"
-          prop="apiGroup"
-          sortable="custom"
-        />
-        <el-table-column
-          align="left"
-          label="API简介"
-          min-width="150"
-          prop="description"
-          sortable="custom"
-        />
-        <el-table-column
-          align="left"
-          label="请求"
-          min-width="150"
-          prop="method"
-          sortable="custom"
-        >
           <template #default="scope">
             <div>
               {{ scope.row.method }} / {{ methodFilter(scope.row.method) }}
@@ -123,108 +47,44 @@
           </template>
         </el-table-column>
 
-        <el-table-column
+        <el-table-column align="left" fixed="right" label="操作" width="200">
-          align="left"
-          fixed="right"
-          label="操作"
-          width="200"
-        >
           <template #default="scope">
-            <el-button
+            <el-button icon="edit" type="primary" link @click="editApiFunc(scope.row)">编辑</el-button>
-              icon="edit"
+            <el-button icon="delete" type="primary" link @click="deleteApiFunc(scope.row)">删除</el-button>
-
-              type="primary"
-              link
-              @click="editApiFunc(scope.row)"
-            >编辑</el-button>
-            <el-button
-              icon="delete"
-
-              type="primary"
-              link
-              @click="deleteApiFunc(scope.row)"
-            >删除</el-button>
           </template>
         </el-table-column>
       </el-table>
       <div class="gva-pagination">
-        <el-pagination
+        <el-pagination :current-page="page" :page-size="pageSize" :page-sizes="[10, 30, 50, 100]" :total="total"
-          :current-page="page"
+          layout="total, sizes, prev, pager, next, jumper" @current-change="handleCurrentChange"
-          :page-size="pageSize"
+          @size-change="handleSizeChange" />
-          :page-sizes="[10, 30, 50, 100]"
-          :total="total"
-          layout="total, sizes, prev, pager, next, jumper"
-          @current-change="handleCurrentChange"
-          @size-change="handleSizeChange"
-        />
       </div>
 
     </div>
 
-    <el-dialog
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle">
-      v-model="dialogFormVisible"
-      :before-close="closeDialog"
-      :title="dialogTitle"
-    >
       <warning-bar title="新增API，需要在角色管理内配置权限才可使用" />
-      <el-form
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="80px">
-        ref="apiForm"
+        <el-form-item label="路径" prop="path">
-        :model="form"
+          <el-input v-model="form.path" autocomplete="off" />
-        :rules="rules"
-        label-width="80px"
-      >
-        <el-form-item
-          label="路径"
-          prop="path"
-        >
-          <el-input
-            v-model="form.path"
-            autocomplete="off"
-          />
         </el-form-item>
-        <el-form-item
+        <el-form-item label="请求" prop="method">
-          label="请求"
+          <el-select v-model="form.method" placeholder="请选择" style="width:100%">
-          prop="method"
+            <el-option v-for="item in methodOptions" :key="item.value" :label="`${item.label}(${item.value})`"
-        >
+              :value="item.value" />
-          <el-select
-            v-model="form.method"
-            placeholder="请选择"
-            style="width:100%"
-          >
-            <el-option
-              v-for="item in methodOptions"
-              :key="item.value"
-              :label="`${item.label}(${item.value})`"
-              :value="item.value"
-            />
           </el-select>
         </el-form-item>
-        <el-form-item
+        <el-form-item label="api分组" prop="apiGroup">
-          label="api分组"
+          <el-input v-model="form.apiGroup" autocomplete="off" />
-          prop="apiGroup"
-        >
-          <el-input
-            v-model="form.apiGroup"
-            autocomplete="off"
-          />
         </el-form-item>
-        <el-form-item
+        <el-form-item label="api简介" prop="description">
-          label="api简介"
+          <el-input v-model="form.description" autocomplete="off" />
-          prop="description"
-        >
-          <el-input
-            v-model="form.description"
-            autocomplete="off"
-          />
         </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
           <el-button @click="closeDialog">取 消</el-button>
-          <el-button
+          <el-button type="primary" @click="enterDialog">确 定</el-button>
-            type="primary"
-            @click="enterDialog"
-          >确 定</el-button>
         </div>
       </template>
     </el-dialog>
@@ -342,7 +202,7 @@ const sortChange = ({ prop, order }) => {
 }
 
 // 查询
-const getTableData = async() => {
+const getTableData = async () => {
   const table = await getApiList({ page: page.value, pageSize: pageSize.value, ...searchInfo.value })
   if (table.code === 0) {
     tableData.value = table.data.list
@@ -359,12 +219,12 @@ const handleSelectionChange = (val) => {
   apis.value = val
 }
 
-const onDelete = async() => {
+const onDelete = async () => {
   ElMessageBox.confirm('确定要删除吗?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning'
-  }).then(async() => {
+  }).then(async () => {
     const ids = apis.value.map(item => item.ID)
     const res = await deleteApisByIds({ ids })
     if (res.code === 0) {
@@ -379,12 +239,12 @@ const onDelete = async() => {
     }
   })
 }
-const onFresh = async() => {
+const onFresh = async () => {
   ElMessageBox.confirm('确定要刷新缓存吗?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning'
-  }).then(async() => {
+  }).then(async () => {
     const res = await freshCasbin()
     if (res.code === 0) {
       ElMessage({
@@ -428,13 +288,13 @@ const closeDialog = () => {
   dialogFormVisible.value = false
 }
 
-const editApiFunc = async(row) => {
+const editApiFunc = async (row) => {
   const res = await getApiById({ id: row.ID })
   form.value = res.data.api
   openDialog('edit')
 }
 
-const enterDialog = async() => {
+const enterDialog = async () => {
   apiForm.value.validate(async valid => {
     if (valid) {
       switch (type.value) {
@@ -482,13 +342,13 @@ const enterDialog = async() => {
   })
 }
 
-const deleteApiFunc = async(row) => {
+const deleteApiFunc = async (row) => {
   ElMessageBox.confirm('此操作将永久删除所有角色下该api, 是否继续?', '提示', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning'
   })
-    .then(async() => {
+    .then(async () => {
       const res = await deleteApi(row)
       if (res.code === 0) {
         ElMessage({

src/view/superAdmin/authority/components/apis.vue

@@ -1,31 +1,14 @@
 <template>
   <div>
     <div class="sticky top-0.5 z-10 bg-white">
-      <el-input
+      <el-input v-model="filterText" class="w-3/5" placeholder="筛选" />
-        v-model="filterText"
+      <el-button class="float-right" type="primary" @click="authApiEnter">确 定</el-button>
-        class="w-3/5"
-        placeholder="筛选"
-      />
-      <el-button
-        class="float-right"
-        type="primary"
-        @click="authApiEnter"
-      >确 定</el-button>
     </div>
     <div class="tree-content">
       <el-scrollbar>
-        <el-tree
+        <el-tree ref="apiTree" :data="apiTreeData" :default-checked-keys="apiTreeIds" :props="apiDefaultProps"
-          ref="apiTree"
+          default-expand-all highlight-current node-key="onlyId" show-checkbox :filter-node-method="filterNode"
-          :data="apiTreeData"
+          @check="nodeChange" />
-          :default-checked-keys="apiTreeIds"
-          :props="apiDefaultProps"
-          default-expand-all
-          highlight-current
-          node-key="onlyId"
-          show-checkbox
-          :filter-node-method="filterNode"
-          @check="nodeChange"
-        />
       </el-scrollbar>
     </div>
   </div>
@@ -43,7 +26,7 @@ defineOptions({
 
 const props = defineProps({
   row: {
-    default: function() {
+    default: function () {
       return {}
     },
     type: Object
@@ -60,7 +43,7 @@ const filterText = ref('')
 const apiTreeData = ref([])
 const apiTreeIds = ref([])
 const activeUserId = ref('')
-const init = async() => {
+const init = async () => {
   const res2 = await getAllApis()
   const apis = res2.data.apis
 
@@ -112,7 +95,7 @@ const buildApiTree = (apis) => {
 
 // 关联关系确定
 const apiTree = ref(null)
-const authApiEnter = async() => {
+const authApiEnter = async () => {
   const checkArr = apiTree.value.getCheckedNodes(true)
   var casbinInfos = []
   checkArr && checkArr.forEach(item => {
@@ -145,4 +128,3 @@ watch(filterText, (val) => {
 })
 
 </script>
-

src/view/superAdmin/authority/components/datas.vue

@@ -1,40 +1,16 @@
 <template>
   <div>
     <warning-bar
-      title="此功能仅用于创建角色和角色的many2many关系表，具体使用还须自己结合表实现业务，详情参考示例代码（客户示例）。此功能不建议使用，建议使用插件市场【组织管理功能（点击前往）】来管理资源权限。"
+      title="此功能仅用于创建角色和角色的many2many关系表，具体使用还须自己结合表实现业务，详情参考示例代码（客户示例）。此功能不建议使用，建议使用插件市场【组织管理功能（点击前往）】来管理资源权限。" />
-    />
     <div class="sticky top-0.5 z-10 bg-white my-4">
-      <el-button
+      <el-button class="float-left" type="primary" @click="all">全选</el-button>
-        class="float-left"
+      <el-button class="float-left" type="primary" @click="self">本角色</el-button>
-        type="primary"
+      <el-button class="float-left" type="primary" @click="selfAndChildren">本角色及子角色</el-button>
-        @click="all"
+      <el-button class="float-right" type="primary" @click="authDataEnter">确 定</el-button>
-      >全选</el-button>
-      <el-button
-        class="float-left"
-        type="primary"
-        @click="self"
-      >本角色</el-button>
-      <el-button
-        class="float-left"
-        type="primary"
-        @click="selfAndChildren"
-      >本角色及子角色</el-button>
-      <el-button
-        class="float-right"
-        type="primary"
-        @click="authDataEnter"
-      >确 定</el-button>
     </div>
     <div class="clear-both pt-4">
-      <el-checkbox-group
+      <el-checkbox-group v-model="dataAuthorityId" @change="selectAuthority">
-        v-model="dataAuthorityId"
+        <el-checkbox v-for="(item, key) in authoritys" :key="key" :value="item">{{ item.authorityName }}</el-checkbox>
-        @change="selectAuthority"
-      >
-        <el-checkbox
-          v-for="(item,key) in authoritys"
-          :key="key"
-          :label="item"
-        >{{ item.authorityName }}</el-checkbox>
       </el-checkbox-group>
     </div>
   </div>
@@ -52,13 +28,13 @@ defineOptions({
 
 const props = defineProps({
   row: {
-    default: function() {
+    default: function () {
       return {}
     },
     type: Object
   },
   authority: {
-    default: function() {
+    default: function () {
       return []
     },
     type: Array
@@ -121,7 +97,7 @@ const getChildrenId = (row, arrBox) => {
   })
 }
 // 提交
-const authDataEnter = async() => {
+const authDataEnter = async () => {
   const res = await setDataAuthority(props.row)
   if (res.code === 0) {
     ElMessage({ type: 'success', message: '资源设置成功' })

src/view/superAdmin/authority/components/menus.vue

@@ -1,53 +1,26 @@
 <template>
   <div>
     <div class="sticky top-0.5 z-10 bg-white">
-      <el-input
+      <el-input v-model="filterText" class="w-3/5" placeholder="筛选" />
-        v-model="filterText"
+      <el-button class="float-right" type="primary" @click="relation">确 定</el-button>
-        class="w-3/5"
-        placeholder="筛选"
-      />
-      <el-button
-        class="float-right"
-        type="primary"
-        @click="relation"
-      >确 定</el-button>
     </div>
     <div class="tree-content clear-both">
       <el-scrollbar>
-        <el-tree
+        <el-tree ref="menuTree" :data="menuTreeData" :default-checked-keys="menuTreeIds" :props="menuDefaultProps"
-          ref="menuTree"
+          default-expand-all highlight-current node-key="ID" show-checkbox :filter-node-method="filterNode"
-          :data="menuTreeData"
+          @check="nodeChange">
-          :default-checked-keys="menuTreeIds"
+          <template #default="{ node, data }">
-          :props="menuDefaultProps"
-          default-expand-all
-          highlight-current
-          node-key="ID"
-          show-checkbox
-          :filter-node-method="filterNode"
-          @check="nodeChange"
-        >
-          <template #default="{ node , data }">
             <span class="custom-tree-node">
               <span>{{ node.label }}</span>
               <span>
-                <el-button
+                <el-button type="primary" link
-                  type="primary"
+                  :style="{ color: row.defaultRouter === data.name ? '#E6A23C' : '#85ce61' }" :disabled="!node.checked"
-                  link
+                  @click="() => setDefault(data)">
-
+                  {{ row.defaultRouter === data.name ? "首页" : "设为首页" }}
-                  :style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
-                  :disabled="!node.checked"
-                  @click="() => setDefault(data)"
-                >
-                  {{ row.defaultRouter === data.name?"首页":"设为首页" }}
                 </el-button>
               </span>
               <span v-if="data.menuBtn.length">
-                <el-button
+                <el-button type="primary" link @click="() => OpenBtn(data)">
-                  type="primary"
-                  link
-
-                  @click="() => OpenBtn(data)"
-                >
                   分配按钮
                 </el-button>
               </span>
@@ -56,37 +29,16 @@
         </el-tree>
       </el-scrollbar>
     </div>
-    <el-dialog
+    <el-dialog v-model="btnVisible" title="分配按钮" destroy-on-close>
-      v-model="btnVisible"
+      <el-table ref="btnTableRef" :data="btnData" row-key="ID" @selection-change="handleSelectionChange">
-      title="分配按钮"
+        <el-table-column type="selection" width="55" />
-      destroy-on-close
+        <el-table-column label="按钮名称" prop="name" />
-    >
+        <el-table-column label="按钮备注" prop="desc" />
-      <el-table
-        ref="btnTableRef"
-        :data="btnData"
-        row-key="ID"
-        @selection-change="handleSelectionChange"
-      >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          label="按钮名称"
-          prop="name"
-        />
-        <el-table-column
-          label="按钮备注"
-          prop="desc"
-        />
       </el-table>
       <template #footer>
         <div class="dialog-footer">
           <el-button @click="closeDialog">取 消</el-button>
-          <el-button
+          <el-button type="primary" @click="enterDialog">确 定</el-button>
-            type="primary"
-            @click="enterDialog"
-          >确 定</el-button>
         </div>
       </template>
     </el-dialog>
@@ -95,9 +47,7 @@
 
 <script setup>
 import { getBaseMenuTree, getMenuAuthority, addMenuAuthority } from '@/api/menu'
-import {
+import { updateAuthority } from '@/api/authority'
-  updateAuthority
-} from '@/api/authority'
 import { getAuthorityBtnApi, setAuthorityBtnApi } from '@/api/authorityBtn'
 import { nextTick, ref, watch } from 'vue'
 import { ElMessage } from 'element-plus'
@@ -108,7 +58,7 @@ defineOptions({
 
 const props = defineProps({
   row: {
-    default: function() {
+    default: function () {
       return {}
     },
     type: Object
@@ -122,12 +72,12 @@ const menuTreeIds = ref([])
 const needConfirm = ref(false)
 const menuDefaultProps = ref({
   children: 'children',
-  label: function(data) {
+  label: function (data) {
     return data.meta.title
   }
 })
 
-const init = async() => {
+const init = async () => {
   // 获取所有菜单树
   const res = await getBaseMenuTree()
   menuTreeData.value = res.data.menus
@@ -145,8 +95,13 @@ const init = async() => {
 
 init()
 
-const setDefault = async(data) => {
+const setDefault = async (data) => {
-  const res = await updateAuthority({ authorityId: props.row.authorityId, AuthorityName: props.row.authorityName, parentId: props.row.parentId, defaultRouter: data.name })
+  const res = await updateAuthority({
+    authorityId: props.row.authorityId,
+    AuthorityName: props.row.authorityName,
+    parentId: props.row.parentId,
+    defaultRouter: data.name
+  })
   if (res.code === 0) {
     ElMessage({ type: 'success', message: '设置成功' })
     emit('changeRow', 'defaultRouter', res.data.authority.defaultRouter)
@@ -161,7 +116,7 @@ const enterAndNext = () => {
 }
 // 关联树 确认方法
 const menuTree = ref(null)
-const relation = async() => {
+const relation = async () => {
   const checkArr = menuTree.value.getCheckedNodes(false, true)
   const res = await addMenuAuthority({
     menus: checkArr,
@@ -183,9 +138,12 @@ const btnData = ref([])
 const multipleSelection = ref([])
 const btnTableRef = ref()
 let menuID = ''
-const OpenBtn = async(data) => {
+const OpenBtn = async (data) => {
   menuID = data.ID
-  const res = await getAuthorityBtnApi({ menuID: menuID, authorityId: props.row.authorityId })
+  const res = await getAuthorityBtnApi({
+    menuID: menuID,
+    authorityId: props.row.authorityId
+  })
   if (res.code === 0) {
     openDialog(data)
     await nextTick()
@@ -213,7 +171,7 @@ const openDialog = (data) => {
 const closeDialog = () => {
   btnVisible.value = false
 }
-const enterDialog = async() => {
+const enterDialog = async () => {
   const selected = multipleSelection.value.map(item => item.ID)
   const res = await setAuthorityBtnApi({
     menuID,
@@ -239,8 +197,8 @@ watch(filterText, (val) => {
 </script>
 
 <style lang="scss" scoped>
-.custom-tree-node{
+.custom-tree-node {
-  span+span{
+  span+span {
     @apply ml-3;
   }
 }