feat: 新增cookie值填写

src/components/_base/navbar/index.vue

@@ -36,7 +36,7 @@ const setServerMenu = () => {
 };
 
 const handleDopdownClick = (item) => {
-  router.push({ name: item.pathName });
+  router.push({ name: item.routeName });
 };
 </script>
 

src/stores/modules/side-bar/constants.ts

@@ -3,8 +3,8 @@ export const MENU_LIST = [
   {
     id: MENU_GROUP_IDS.WORK_BENCH_ID,
     name: '工作台',
-    pathName: 'Home',
+    routeName: 'Home',
-    pathNames: ['Home'],
+    includeRouteNames: ['Home'],
     requiresAuth: false,
     permissionKey: '', // 权限key，如果为空，则表示该菜单不需要权限，与后端约定
   },
@@ -16,33 +16,33 @@ export const MENU_LIST = [
     children: [
       {
         name: '行业热门话题洞察',
-        pathName: 'DataEngineHotTranslation',
+        routeName: 'DataEngineHotTranslation',
-        pathNames: ['DataEngineHotTranslation'],
+        includeRouteNames: ['DataEngineHotTranslation'],
       },
       {
         name: '行业词云',
-        pathName: 'DataEngineHotCloud',
+        routeName: 'DataEngineHotCloud',
-        pathNames: ['DataEngineHotCloud'],
+        includeRouteNames: ['DataEngineHotCloud'],
       },
       {
         name: '行业关键词动向',
-        pathName: 'DataEngineKeyWord',
+        routeName: 'DataEngineKeyWord',
-        pathNames: ['DataEngineKeyWord'],
+        includeRouteNames: ['DataEngineKeyWord'],
       },
       {
         name: '用户痛点观察',
-        pathName: 'DataEngineUserPainPoints',
+        routeName: 'DataEngineUserPainPoints',
-        pathNames: ['DataEngineUserPainPoints'],
+        includeRouteNames: ['DataEngineUserPainPoints'],
       },
       {
         name: '重点品牌动向',
-        pathName: 'DataEngineKeyBrandMovement',
+        routeName: 'DataEngineKeyBrandMovement',
-        pathNames: ['DataEngineKeyBrandMovement'],
+        includeRouteNames: ['DataEngineKeyBrandMovement'],
       },
       {
         name: '用户画像',
-        pathName: 'DataEngineUserPersona',
+        routeName: 'DataEngineUserPersona',
-        pathNames: ['DataEngineUserPersona'],
+        includeRouteNames: ['DataEngineUserPersona'],
       },
     ],
   },
@@ -54,18 +54,22 @@ export const MENU_LIST = [
     children: [
       {
         name: '品牌资产管理',
-        pathName: 'RepositoryBrandMaterials',
+        routeName: 'RepositoryBrandMaterials',
-        pathNames: ['RepositoryBrandMaterials'],
+        includeRouteNames: ['RepositoryBrandMaterials'],
       },
       {
         name: '账号资源中心',
-        pathName: 'MediaAccountAccountManagement',
+        routeName: 'MediaAccountAccountManagement',
-        pathNames: ['MediaAccountAccountManagement', 'MediaAccountAccountDashboard', 'MediaAccountAccountDetails'],
+        includeRouteNames: [
+          'MediaAccountAccountManagement',
+          'MediaAccountAccountDashboard',
+          'MediaAccountAccountDetails',
+        ],
       },
       {
         name: '投放资源中心',
-        pathName: 'PutAccountAccountManagement',
+        routeName: 'PutAccountAccountManagement',
-        pathNames: [
+        includeRouteNames: [
           'PutAccountAccountManagement',
           'PutAccountAccountData',
           'PutAccountAccountDashboard',
@@ -75,8 +79,11 @@ export const MENU_LIST = [
       },
       {
         name: '智能方案管理',
-        pathName: 'IntelligentSolutionBusinessAnalysisReport',
+        routeName: 'IntelligentSolutionBusinessAnalysisReport',
-        pathNames: ['IntelligentSolutionBusinessAnalysisReport', 'IntelligentSolutionCompetitiveProductAnalysisReport'],
+        includeRouteNames: [
+          'IntelligentSolutionBusinessAnalysisReport',
+          'IntelligentSolutionCompetitiveProductAnalysisReport',
+        ],
       },
     ],
   },

src/stores/modules/user/index.ts

@@ -89,9 +89,9 @@ export const useUserStore = defineStore('user', {
         }
       });
 
-      const pushAllowAccessRoutes = (pathNames: string[]) => {
+      const pushAllowAccessRoutes = (includeRouteNames: string[]) => {
         const matchedRoute = appRoutes
-          .filter((route: any) => pathNames.includes(route.name))
+          .filter((route: any) => includeRouteNames.includes(route.name))
           .map((route: any) => route.name);
         this.allowAccessRoutes.push(...matchedRoute);
       };
@@ -99,10 +99,10 @@ export const useUserStore = defineStore('user', {
       menuList.forEach((item) => {
         if (item.children && item.children.length > 0) {
           item.children.forEach((child: any) => {
-            pushAllowAccessRoutes(child.pathNames);
+            pushAllowAccessRoutes(child.includeRouteNames);
           });
         } else {
-          pushAllowAccessRoutes(item.pathNames);
+          pushAllowAccessRoutes(item.includeRouteNames);
         }
       });
 

src/views/property-marketing/media-account/account-manage/components/add-account-modal/index.vue

@@ -87,15 +87,12 @@
           </a-form-item>
         </template>
 
-        <a-form-item label="手机号" field="mobile" required>
+        <a-form-item label="手机号码" field="mobile" required>
           <a-input v-model="form.mobile" placeholder="请输入..." size="large" />
         </a-form-item>
         <a-form-item label="运营人员" field="operator_name" required>
           <a-input v-model="form.operator_name" placeholder="请输入..." class="w-240px" size="large" />
         </a-form-item>
-        <a-form-item label="号码持有人" field="holder_name" required>
-          <a-input v-model="form.holder_name" placeholder="请输入..." class="w-240px" size="large" />
-        </a-form-item>
         <a-form-item label="运营平台" :required="!isEdit">
           <img v-if="isEdit" :src="form.platform === 0 ? icon3 : icon4" width="24" height="24" />
           <a-radio-group v-else v-model="form.platform">
@@ -103,6 +100,9 @@
             <a-radio :value="1">小红书</a-radio>
           </a-radio-group>
         </a-form-item>
+        <a-form-item label="号码持有人" field="holder_name">
+          <a-input v-model="form.holder_name" placeholder="请输入..." class="w-240px" size="large" />
+        </a-form-item>
         <a-form-item label="选择分组">
           <GroupSelect
             v-model="form.group_id"
@@ -130,6 +130,24 @@
             :auto-size="{ minRows: 3, maxRows: 5 }"
           />
         </a-form-item>
+        <a-form-item label="Cookie值">
+          <template #label>
+            <span class="label">Cookie值</span>
+            <a-tooltip content="开启后可直接填写 Cookie，无需扫码授权">
+              <icon-question-circle size="14" class="ml-4px color-#737478" />
+            </a-tooltip>
+          </template>
+          <a-switch v-model="isCustomCookie" size="large" />
+        </a-form-item>
+        <a-form-item v-if="isCustomCookie" label="" field="cookie">
+          <a-textarea
+            v-model="form.cookie"
+            placeholder="请输入..."
+            size="large"
+            max-length="72"
+            :auto-size="{ minRows: 3, maxRows: 5 }"
+          />
+        </a-form-item>
       </template>
     </a-form>
     <template #footer>
@@ -181,7 +199,8 @@ const INITIAL_FORM = {
   platform: 0,
   group_id: undefined,
   tag_ids: [],
-  end_work_link: '',
+  end_work_link: undefined,
+  cookie: undefined,
 };
 
 const groupOptions = ref([]);
@@ -197,6 +216,7 @@ const file = ref(null);
 const authorizedAccountModalRef = ref(null);
 const importPromptModalRef = ref(null);
 const uploadRef = ref(null);
+const isCustomCookie = ref(false);
 const form = ref(cloneDeep(INITIAL_FORM));
 
 const rules = {
@@ -218,7 +238,7 @@ const rules = {
     },
   ],
   operator_name: [{ required: true, message: '请输入运营人员' }],
-  holder_name: [{ required: true, message: '请输入号码持有人' }],
+  // holder_name: [{ required: true, message: '请输入号码持有人' }],
 };
 
 const isBatchImport = computed(() => uploadType.value === 'batch');
@@ -266,6 +286,7 @@ const reset = () => {
   fileName.value = '';
   file.value = null;
   isEdit.value = false;
+  isCustomCookie.value = false;
   uploadStatus.value = UploadStatus.DEFAULT;
   uploadType.value = 'manual';
 };
@@ -320,6 +341,30 @@ const handleBatchImport = async () => {
   }
 };
 
+const handleAddAccount = async () => {
+  const _isCustomCookie = isCustomCookie.value;
+  const { code, data } = await postMediaAccounts({
+    ...form.value,
+    cookie: _isCustomCookie ? form.value.cookie : undefined,
+  });
+  if (code === 200) {
+    emits('update');
+    onClose();
+
+    const { id, platform } = data;
+    !_isCustomCookie && startAuthorized(id, platform);
+  }
+};
+
+const handleEditAccount = async () => {
+  const { code } = await putMediaAccounts({ id: id.value, ...form.value });
+  if (code === 200) {
+    AMessage.success('修改成功');
+    emits('update');
+    onClose();
+  }
+};
+
 async function onSubmit() {
   if (isBatchImport.value) {
     handleBatchImport();
@@ -328,17 +373,7 @@ async function onSubmit() {
 
   formRef.value.validate(async (errors) => {
     if (!errors) {
-      const _fn = id.value ? putMediaAccounts : postMediaAccounts;
+      isEdit.value ? handleEditAccount() : handleAddAccount();
-      const _params = id.value ? { id: id.value, ...form.value } : form.value;
-      const { code, data } = await _fn(_params);
-      if (code === 200) {
-        isEdit.value && AMessage.success('修改成功');
-        emits('update');
-        onClose();
-        if (!isEdit.value) {
-          startAuthorized(data?.id, data?.platform);
-        }
-      }
     }
   });
 }

src/views/property-marketing/media-account/account-manage/components/authorized-account-modal/index.vue

@@ -34,7 +34,7 @@
           <div class="img-box">
             <template v-if="qrCodeLoading || isFailLoadQrCode">
               <div class="relative w-160px h-160px">
-                <a-image v-if="qrCodeLoading" :src="icon1" width="160" height="160" />
+                <a-image :src="icon1" width="160" height="160" />
                 <div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
                   <img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" />
                   <icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
@@ -49,7 +49,7 @@
             </template>
             <a-image v-else :src="qrCodeUrl" width="160" height="160" />
 
-            <div v-if="isOverdue" class="mask cursor-pointer" @click="getAuthorizedQrCode">
+            <div v-if="isOverdue" class="mask cursor-pointer" @click="handleRefreshQrCode">
               <icon-refresh size="24" class="mb-13px" />
               <p class="s1">二维码失效</p>
               <p class="s1">请点击刷新</p>
@@ -225,11 +225,15 @@ const clearOverdueTimer = () => {
     overdueTimer = null;
   }
 };
+// 重新扫码
+const handleRefreshQrCode = () => {
+  resetTaskFields();
+  getAuthorizedQrCode();
+};
 
 const handleOk = () => {
   if (isFailLoadQrCode.value) {
-    resetTaskFields();
+    handleRefreshQrCode();
-    getAuthorizedQrCode();
     return;
   }
 
@@ -249,8 +253,7 @@ const handleOk = () => {
     if (isSuccess.value) {
       close();
     } else {
-      resetTaskFields();
+      handleRefreshQrCode();
-      getAuthorizedQrCode();
     }
   } else {
     startLoading();

src/views/property-marketing/media-account/account-manage/components/reauthorize-account-modal/index.vue

@@ -34,7 +34,7 @@
         <div class="img-box">
           <template v-if="qrCodeLoading || isFailLoadQrCode">
             <div class="relative w-160px h-160px">
-              <a-image v-if="qrCodeLoading" :src="icon1" width="160" height="160" />
+              <a-image :src="icon1" width="160" height="160" />
               <div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
                 <img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" />
                 <icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
@@ -49,7 +49,7 @@
           </template>
           <a-image v-else :src="qrCodeUrl" width="160" height="160" />
 
-          <div v-if="isOverdue" class="mask cursor-pointer" @click="getAuthorizedQrCode">
+          <div v-if="isOverdue" class="mask cursor-pointer" @click="handleRefreshQrCode">
             <icon-refresh size="24" class="mb-13px" />
             <p class="s1">二维码失效</p>
             <p class="s1">请点击刷新</p>
@@ -277,11 +277,16 @@ const clearStatusPollingTimer = () => {
   }
 };
 
+// 重新扫码
+const handleRefreshQrCode = () => {
+  resetTaskFields();
+  getAuthorizedQrCode();
+};
+
 const handleOk = () => {
   if (taskStep.value === TASK_STEP.default) {
     if (isFailLoadQrCode.value) {
-      resetTaskFields();
+      handleRefreshQrCode();
-      getAuthorizedQrCode();
       return;
     }
 
@@ -308,8 +313,7 @@ const handleOk = () => {
       if (isSuccess.value) {
         close();
       } else {
-        resetTaskFields();
+        handleRefreshQrCode();
-        getAuthorizedQrCode();
       }
     }
   }