From a2a615d18d4bc34c1368e0b5f133702fca7db448 Mon Sep 17 00:00:00 2001
From: dzq <dzq@ys.com>
Date: Wed, 18 Jun 2025 16:57:33 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E6=9D=83=E9=99=90=E6=8E=A7=E5=88=B6):=20?=
 =?UTF-8?q?=E5=AE=9E=E7=8E=B0=E6=8C=89=E9=92=AE=E7=BA=A7=E6=9D=83=E9=99=90?=
 =?UTF-8?q?=E6=8E=A7=E5=88=B6=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加按钮权限控制功能，包括：
1. 新增权限存储模块和权限获取API
2. 在App.vue初始化时获取权限
3. 在多个页面组件中添加权限检查逻辑
4. 移除角色管理页面中不必要的分类显示
5. 在店铺表单中添加二维码和链接复制功能
---
 src/App.vue                                   |  7 +++-
 src/api/common/login.ts                       |  7 +++-
 src/store/modules/btnPermission.ts            | 31 ++++++++++++++++++
 src/views/cabinet/shop/shop-form-modal.vue    | 32 +++++++++++++++----
 .../cabinet/smart-cabinet-card/detail.vue     | 21 +++++++-----
 .../cabinet/smart-cabinet-card/index.vue      |  4 ++-
 src/views/shop/goods/detail.vue               |  5 ++-
 src/views/shop/goods/index.vue                |  4 ++-
 src/views/system/role/index.vue               |  2 +-
 9 files changed, 93 insertions(+), 20 deletions(-)
 create mode 100644 src/store/modules/btnPermission.ts

diff --git a/src/App.vue b/src/App.vue
index db21e42..ad39175 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,11 +1,16 @@
 <script setup lang="ts">
-import { computed } from "vue";
+import { computed, onMounted } from "vue";
 import { ElConfigProvider } from "element-plus";
 import zhCn from "element-plus/lib/locale/lang/zh-cn";
 import { ReDialog } from "@/components/ReDialog";
+import { useBtnPermissionStore } from "@/store/modules/btnPermission";
 
 const currentLocale = computed(() => zhCn);
+const btnPermissionStore = useBtnPermissionStore();
 
+onMounted(async () => {
+  await btnPermissionStore.fetchPermissions();
+})
 </script>
 
 <template>
diff --git a/src/api/common/login.ts b/src/api/common/login.ts
index 7395673..6518ad2 100644
--- a/src/api/common/login.ts
+++ b/src/api/common/login.ts
@@ -187,4 +187,9 @@ export interface QyUserLoginDTO {
   roleId?: number;
   /** 角色名称 */
   roleName?: string;
-}
\ No newline at end of file
+}
+
+/** 获取动态菜单 */
+export const getPermissions = () => {
+  return http.request<ResponseData<string[]>>("get", "/getPermissions");
+};
\ No newline at end of file
diff --git a/src/store/modules/btnPermission.ts b/src/store/modules/btnPermission.ts
new file mode 100644
index 0000000..8e980a5
--- /dev/null
+++ b/src/store/modules/btnPermission.ts
@@ -0,0 +1,31 @@
+import { defineStore } from "pinia";
+import { ref } from "vue";
+import { store } from "@/store";
+import { getPermissions } from "@/api/common/login";
+
+export const useBtnPermissionStore = defineStore("btnPermission", () => {
+  const btnPermissions = ref<string[]>([]);
+
+  const fetchPermissions = async () => {
+    const res = await getPermissions();
+    btnPermissions.value = res.data;
+  }
+
+  const hasPermission = (permission: string) => {
+    return btnPermissions.value.includes(permission);
+  }
+
+  return {
+    btnPermissions,
+    fetchPermissions,
+    hasPermission,
+  };
+});
+
+
+/**
+ * @description 用于在 setup 外使用 store
+ */
+export function useBtnPermissionStoreOutside() {
+  return useBtnPermissionStore(store)
+}
diff --git a/src/views/cabinet/shop/shop-form-modal.vue b/src/views/cabinet/shop/shop-form-modal.vue
index 3e01e6b..830b797 100644
--- a/src/views/cabinet/shop/shop-form-modal.vue
+++ b/src/views/cabinet/shop/shop-form-modal.vue
@@ -5,6 +5,8 @@ import { paymentMethodOptions, modeToPaymentMethodMap } from "@/utils/maps/payme
 import { addShop, updateShop, ShopDTO, UpdateShopCommand, AddShopCommand } from "@/api/shop/shop";
 import { useWxStore } from "@/store/modules/wx";
 import Upload from "@iconify-icons/ep/upload";
+import ReQrcode from "@/components/ReQrcode";
+import { copyTextToClipboard } from "@pureadmin/utils";
 const { VITE_APP_BASE_API } = import.meta.env;
 
 const props = defineProps({
@@ -120,6 +122,16 @@ const currentPaymentMethods = computed(() => {
     return option ? { label: option.label, type: option.type } : null;
   }).filter(Boolean);
 });
+
+const copyLink = () => {
+  if (!formData.value.shopId) {
+    ElMessage.warning("店铺ID不存在，无法复制链接");
+    return;
+  }
+  const url = `http://wxshop.ab98.cn/shop-api/api/shop/wechatAuth?shopId=${formData.value.shopId}`;
+  const success = copyTextToClipboard(url);
+  success ? ElMessage.success('链接复制成功') : ElMessage.error('复制失败，请手动复制');
+};
 </script>
 
 <template>
@@ -175,15 +187,23 @@ const currentPaymentMethods = computed(() => {
         </el-select>
       </el-form-item> -->
       <el-form-item label="支付方式">
-        <el-tag 
-          v-for="method in currentPaymentMethods" 
-          :key="method.label" 
-          :type="method.type" 
-          style="margin-right: 5px;"
-        >
+        <el-tag v-for="method in currentPaymentMethods" :key="method.label" :type="method.type"
+          style="margin-right: 5px;">
           {{ method.label }}
         </el-tag>
       </el-form-item>
+      <el-form-item label="机柜数量">
+        {{ props.row.cabinetCount || 0 }}
+      </el-form-item>
+      <el-form-item label="二维码">
+        <div class="flex flex-col items-center">
+          <ReQrcode :text="`http://wxshop.ab98.cn/shop-api/api/shop/wechatAuth?shopId=${formData.shopId}`"
+            :options="{ width: 150 }" :width="150"/>
+          <el-button type="primary" size="small" @click="copyLink" style="margin-left: 10px;">
+            复制链接
+          </el-button>
+        </div>
+      </el-form-item>
     </el-form>
     <template #footer>
       <el-button @click="handleClose" style="margin-right: 5px;">取消</el-button>
diff --git a/src/views/cabinet/smart-cabinet-card/detail.vue b/src/views/cabinet/smart-cabinet-card/detail.vue
index e20bf8d..b5e435b 100644
--- a/src/views/cabinet/smart-cabinet-card/detail.vue
+++ b/src/views/cabinet/smart-cabinet-card/detail.vue
@@ -23,6 +23,7 @@ import { getGoodsInfo } from "@/api/shop/goods";
 import EditCabinetDrawer from "./edit-cabinet-drawer.vue";
 import { CabinetMainboardDTO, deleteMainboard, getMainboardList, updateMainboard } from "@/api/cabinet/mainboards";
 import { getShopById, ShopDTO, getModeText } from "@/api/shop/shop";
+import { useBtnPermissionStore } from "@/store/modules/btnPermission";
 
 defineOptions({
   name: "SmartCabinetDetail"
@@ -30,6 +31,7 @@ defineOptions({
 
 const router = useRouter();
 const route = useRoute();
+const { hasPermission } = useBtnPermissionStore();
 const currentCell = ref<CabinetCellDTO>();
 const cabinetInfo = ref<SmartCabinetDTO>({
   cabinetName: "",
@@ -308,7 +310,7 @@ onMounted(() => {
 
         <div class="info-details" v-if="activeTab === 'basic'">
           <div style="display: flex; justify-content: flex-end; margin-bottom: 16px;">
-            <el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="editCabinetDrawerVisible = true">
+            <el-button v-if="hasPermission('shop:cabinet:write')" type="primary" link :icon="useRenderIcon(EditPen)" @click="editCabinetDrawerVisible = true">
               编辑柜体
             </el-button>
           </div>
@@ -318,11 +320,11 @@ onMounted(() => {
             <el-descriptions-item label="柜体格式">{{ CabinetImgMap[cabinetInfo.templateNo]?.name || '-'
               }}</el-descriptions-item>
             <el-descriptions-item label="柜体地址">{{ cabinetInfo.shopName || '-' }}
-              <el-button type="success" link @click="shopConfigVisible = true">
+              <el-button v-if="hasPermission('shop:cabinet:write')" type="success" link @click="shopConfigVisible = true">
                 配置
               </el-button></el-descriptions-item>
             <el-descriptions-item label="柜体网关">{{ cabinetInfo.mqttServerId || '-' }}
-              <el-button type="warning" link @click="gatewayConfigVisible = true">
+              <el-button v-if="hasPermission('shop:cabinet:write')" type="warning" link @click="gatewayConfigVisible = true">
                 配置
               </el-button></el-descriptions-item>
             <el-descriptions-item label="借呗支付">{{ getBalanceEnableText(shopInfo.balanceEnable)
@@ -378,11 +380,13 @@ onMounted(() => {
                   <span class="line-number">{{ item.cellNo }}</span>
                 </div>
                 <div class="action-buttons">
-                  <el-button v-if="!item.goodsId" link type="success"
+                  <el-button v-if="!item.goodsId" :disabled="!hasPermission('shop:cabinet:write')"
+                   link type="success"
                     @click="handleConfigure(item)" class="cell-btn">
                     商品配置
                   </el-button>
-                  <el-button v-if="item.goodsId" link type="primary"
+                  <el-button v-if="item.goodsId" :disabled="!hasPermission('shop:cabinet:write')"
+                   link type="primary"
                     @click="handleEditCell(item)" class="cell-btn">
                     {{ item.goodsName }}
                   </el-button>
@@ -410,10 +414,10 @@ onMounted(() => {
             <el-table-column label="锁控板序号" prop="lockControlNo" width="120" />
             <el-table-column label="操作" width="150" fixed="right">
               <template #default="{ row }">
-                <el-button type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEditMainboard(row)">
+                <el-button v-if="hasPermission('shop:cabinet:write')" type="primary" link :icon="useRenderIcon(EditPen)" @click="handleEditMainboard(row)">
                   编辑
                 </el-button>
-                <el-button type="danger" link :icon="useRenderIcon(Delete)" @click="handleDeleteMainboard(row)">
+                <el-button v-if="hasPermission('shop:cabinet:write')" type="danger" link :icon="useRenderIcon(Delete)" @click="handleDeleteMainboard(row)">
                   删除
                 </el-button>
               </template>
@@ -434,7 +438,8 @@ onMounted(() => {
           @refresh="fetchCabinetDetail" />
       </el-drawer>
       <el-drawer v-model="goodsConfigVisible" title="配置商品" size="50%" direction="rtl">
-        <CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId" :belong-type="shopInfo.mode == 4 ? 1 : 0" @refresh="fetchCellList" />
+        <CabinetGoodsConfigModal v-model="goodsConfigVisible" :cell-id="currentCellId"
+          :belong-type="shopInfo.mode == 4 ? 1 : 0" @refresh="fetchCellList" />
       </el-drawer>
       <el-drawer v-model="configuredGoodsVisible" title="管理商品" size="30%" direction="rtl">
         <ConfiguredGoodsModal v-model="configuredGoodsVisible" :cell-id="currentCell?.cellId"
diff --git a/src/views/cabinet/smart-cabinet-card/index.vue b/src/views/cabinet/smart-cabinet-card/index.vue
index 65a70a8..a98b5ac 100644
--- a/src/views/cabinet/smart-cabinet-card/index.vue
+++ b/src/views/cabinet/smart-cabinet-card/index.vue
@@ -14,6 +14,7 @@ import AddFill from "@iconify-icons/ri/add-circle-line";
 import SmartCabinetCardFormModal from "./smart-cabinet-card-form-modal.vue";
 import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
 import { getModeText } from "@/api/shop/shop";
+import { useBtnPermissionStore } from "@/store/modules/btnPermission";
 const { VITE_PUBLIC_IMG_PATH: IMG_PATH } = import.meta.env;
 
 defineOptions({
@@ -21,6 +22,7 @@ defineOptions({
 });
 
 const router = useRouter();
+const { hasPermission } = useBtnPermissionStore();
 const formRef = ref();
 const modalVisible = ref(false);
 const searchFormParams = ref({
@@ -115,7 +117,7 @@ onMounted(() => {
         <el-form-item class="space-item">
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" :icon="useRenderIcon(AddFill)" @click="modalVisible = true"
+          <el-button v-if="hasPermission('shop:cabinet:write')" type="primary" :icon="useRenderIcon(AddFill)" @click="modalVisible = true"
             style="margin-right: 10px;">
             新增设备
           </el-button>
diff --git a/src/views/shop/goods/detail.vue b/src/views/shop/goods/detail.vue
index 1692406..19e854f 100644
--- a/src/views/shop/goods/detail.vue
+++ b/src/views/shop/goods/detail.vue
@@ -7,6 +7,7 @@ import { ElMessage } from "element-plus";
 import { useRenderIcon } from '@/components/ReIcon/src/hooks';
 import EditPen from '@iconify-icons/ep/edit-pen';
 import GoodsEditModal from "./goods-edit-modal.vue";
+import { useBtnPermissionStore } from "@/store/modules/btnPermission";
 
 const handleEdit = (row: GoodsDTO) => {
   goodsInfo.value = row;
@@ -21,6 +22,8 @@ defineOptions({
 
 const router = useRouter();
 const route = useRoute();
+
+const { hasPermission } = useBtnPermissionStore();
 const goodsInfo = ref<GoodsDTO>({
   goodsId: 0,
   goodsName: "",
@@ -118,7 +121,7 @@ watch(goodsId, () => {
             <el-tab-pane label="基本信息" name="basic"></el-tab-pane>
             <el-tab-pane label="购买记录" name="order"></el-tab-pane>
           </el-tabs>
-          <el-button v-if="goodsInfo.belongType == 0" type="primary" @click="handleEdit(goodsInfo)"
+          <el-button v-if="goodsInfo.belongType == 0 && hasPermission('shop:goods:write')" type="primary" @click="handleEdit(goodsInfo)"
             style="margin-bottom: 12px" :size="'default'">
             编辑商品
           </el-button>
diff --git a/src/views/shop/goods/index.vue b/src/views/shop/goods/index.vue
index 63647f1..54c9477 100644
--- a/src/views/shop/goods/index.vue
+++ b/src/views/shop/goods/index.vue
@@ -17,6 +17,7 @@ import { deleteGoodsApi } from "@/api/shop/goods";
 import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
 import { useRouter } from "vue-router";
 import { useWxStore } from "@/store/modules/wx";
+import { useBtnPermissionStore } from "@/store/modules/btnPermission";
 
 defineOptions({
   name: "ShopGoods"
@@ -24,6 +25,7 @@ defineOptions({
 
 const wxStore = useWxStore();
 const router = useRouter();
+const { hasPermission } = useBtnPermissionStore();
 const formRef = ref();
 const tableRef = ref();
 const modalVisible = ref(false);
@@ -184,7 +186,7 @@ const handleViewDetail = (row: GoodsDTO) => {
       <el-form-item class="space-item">
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" :icon="useRenderIcon(AddFill)" @click="modalVisible = true"
+        <el-button v-if="hasPermission('shop:goods:write')" type="primary" :icon="useRenderIcon(AddFill)" @click="modalVisible = true"
           style="margin-right: 10px;">
           新增商品
         </el-button>
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 37d0a33..3c85c60 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -229,7 +229,7 @@ onSearch().then(() => {
         </template>
         <el-checkbox-group v-model="formData.menuIds" class="checkbox-group">
           <template v-for="menu in processedMenuOptions" :key="menu.categoryName">
-            <span class="menu-category">{{ menu.categoryName }}：</span>
+            <!-- <span class="menu-category">{{ menu.categoryName }}：</span> -->
             <el-checkbox v-for="item in menu.items" :key="item.id" :label="item.id" class="menu-checkbox">
               {{ item.menuName }}
             </el-checkbox>