GTM 代码增加界面和权限过滤

src/views/adweb/enquiry/AdwebEnquiryList.vue

@@ -234,7 +234,7 @@
   import toTotal from '/@/assets/enquiry/enquiryListTop4.svg';
 
   import selectSite from '/@/components/Adweb/selectSite.vue';
-  import { nextTick, onBeforeMount, onMounted, reactive, ref, unref } from 'vue';
+  import { nextTick, onBeforeMount, onMounted, reactive, ref } from 'vue';
   import { BasicTable } from '/@/components/Table';
   import { useListPage } from '/@/hooks/system/useListPage';
   import { columns, superQuerySchema } from './AdwebEnquiry.data';
@@ -252,10 +252,6 @@
   import XpRecycleBinModal from '@/views/adweb/system/modules/XpRecycleBinModal.vue';
   import blackList from '@/views/adweb/enquiry/modules/blackList.vue';
   import enquiryTrackRecord from '@/views/adweb/enquiry/modules/enquiryTrackRecord.vue';
-  import { getToken } from '@/utils/auth';
-  import md5 from 'crypto-js/md5';
-  import { connectWebSocket, onWebSocket } from '@/hooks/web/useWebSocket';
-  import { useGlobSetting } from '@/hooks/setting';
 
   const formRef = ref();
   const queryParam = reactive<any>({});

src/views/adweb/site/AdwebSiteList.vue

@@ -162,18 +162,20 @@
 </template>
 
 <script lang="ts" name="adweb-adwebSite" setup>
-  import { onBeforeMount, reactive, ref } from 'vue';
+  import { computed, onBeforeMount, reactive, ref } from 'vue';
   import { getAction } from '/@/api/manage/manage';
   import { BasicTable, TableAction } from '/src/components/Table';
   import { useListPage } from '/src/hooks/system/useListPage';
   import { columns, superQuerySchema } from './AdwebSite.data';
-  import { batchDelete, deleteOne, getExportUrl, getImportUrl, list, gtmListUrl } from './AdwebSite.api';
+  import { batchDelete, deleteOne, getExportUrl, getImportUrl, list, gtmListUrl, saveOrUpdate } from './AdwebSite.api';
   import AdwebSiteModal from './components/AdwebSiteModal.vue';
   import { useUserStore } from '/src/store/modules/user';
   import SeoProcess from '@/views/adweb/site/components/SeoProcess.vue';
   import JInput from '@/components/Form/src/jeecg/components/JInput.vue';
   import JSearchSelect from '@/components/Form/src/jeecg/components/JSearchSelect.vue';
   import GtmAdd from '@/views/adweb/site/components/GtmAdd.vue';
+  import { RoleEnum } from '@/enums/roleEnum';
+  import { useMessage } from '@/hooks/web/useMessage';
 
   const formRef = ref();
   const queryParam = reactive<any>({});
@@ -184,6 +186,10 @@
   const seoProcessVisible = ref(false);
   const seoProcessRef = ref();
   const gtmRef = ref();
+
+  const isAdmin = computed(() => userStore.getRoleList.includes(RoleEnum.ADMIN));
+  const { createMessage } = useMessage();
+
   let channelProviderList = reactive([{ username: '', workNo: '' }]);
   //注册table数据
   const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
@@ -283,6 +289,22 @@
     await deleteOne({ id: record.id }, handleSuccess);
   }
 
+  async function siteDeleteStatus(record) {
+    record.status = 0;
+
+    await saveOrUpdate(record, true)
+      .then((res) => {
+        if (res.success) {
+          createMessage.success(res.message);
+        } else {
+          createMessage.warning(res.message);
+        }
+
+        reload();
+      })
+      .finally(() => {});
+  }
+
   /**
    * 批量删除事件
    */
@@ -313,24 +335,41 @@
    * 下拉操作栏
    */
   function getDropDownAction(record) {
-    return [
+    let dropDown = [
       {
         label: '详情',
         onClick: handleDetail.bind(null, record),
       },
-      {
+    ];
+
+    if (record.status != 0) {
+      dropDown.push({
+        label: '站点删除',
+        onClick: siteDeleteStatus.bind(null, record),
+      });
+    }
+
+    // 站点已发布，并且是正式域名时可以添加GTM 代码
+    if (record.isDomain === 1 && record.status === 1) {
+      dropDown.push({
         label: '跟踪代码',
         onClick: addGtm.bind(null, record),
-      },
-      {
-        label: '删除',
+      });
+
+      console.log(dropDown, 'dropDowndropDown');
+    }
+
+    if (isAdmin.value) {
+      dropDown.push({
+        label: '资源删除',
         popConfirm: {
           title: '是否确认删除',
           confirm: handleDelete.bind(null, record),
           placement: 'topLeft',
         },
-      },
-    ];
+      });
+    }
+    return dropDown;
   }
 
   /**

src/views/adweb/site/components/GtmAdd.vue

@@ -15,7 +15,6 @@
     <template v-if="modalGtmStatus">
       <a-spin :spinning="spinning" :tip="tipTitle">
         <a-button type="primary" @click="addGTMBySys" style="margin-right: 20px">系统添加</a-button>
-        <!--          <a-button class="manual-add" @click="addGTMByUser">手动添加</a-button>-->
       </a-spin>
     </template>
 
@@ -26,10 +25,22 @@
             <p style="text-align: center; font-weight: bold">系统生成的跟踪代码已添加至网站，请勿重复添加跟踪代码。</p>
           </div>
           <a-form-item label="Gtm Head" prop="head">
-            <a-input v-model="googleGtmForm.head" id="googleGtmHead" type="textarea" :auto-size="{ minRows: 10, maxRows: 15 }" :readOnly="true" />
+            <a-textarea
+              v-model:value="googleGtmForm.head"
+              id="googleGtmHead"
+              type="textarea"
+              :autosize="{ minRows: 10, maxRows: 15 }"
+              :readOnly="true"
+            />
           </a-form-item>
           <a-form-item label="Gtm Body" prop="body">
-            <a-input v-model="googleGtmForm.body" id="googleGtmBody" type="textarea" :auto-size="{ minRows: 10, maxRows: 15 }" :readOnly="true" />
+            <a-textarea
+              v-model:value="googleGtmForm.body"
+              id="googleGtmBody"
+              type="textarea"
+              :autosize="{ minRows: 10, maxRows: 15 }"
+              :readOnly="true"
+            />
           </a-form-item>
         </a-form>
       </a-spin>
@@ -62,10 +73,11 @@
 
 <script setup lang="ts">
   import { reactive, ref } from 'vue';
-  import { getAction } from '/@/api/manage/manage';
-  import { message } from 'ant-design-vue';
+  import { getAction, postActionForm } from '/@/api/manage/manage';
+  import { useMessage } from '@/hooks/web/useMessage';
+  const { createMessage } = useMessage();
 
-  const modalTitle = ref('系统生成跟踪代码');
+  const modalTitle = ref('跟踪代码');
 
   const labelCol = reactive({ span: 3 });
   const wrapperCol = reactive({ span: 21 });
@@ -73,7 +85,7 @@
   const tipTitle = ref('');
   const modalGtmStatus = ref(false);
   const modalManualAddGTMStatus = ref(false);
-
+  let siteInfo = reactive({ id: '', code: '', domain: '', name: '' });
   const modalSysAddGTMStatus = ref(false);
 
   const okBtnStatus = ref(true);
@@ -88,6 +100,8 @@
 
   function init(record) {
     modalVisible.value = true;
+    modalTitle.value = record.name;
+    siteInfo = record;
     addGTM(record);
   }
 
@@ -97,12 +111,13 @@
       id: r.id,
     };
     let gtmListUrl = `/gtm/list`;
+    spinning.value = true;
     getAction(gtmListUrl, params)
       .then(function (res) {
         if (res.code === 200) {
           if (res.result.gtmHead != null && res.result.gtmBody != null) {
             modalVisible.value = true;
-            modalTitle.value = '系统生成跟踪代码';
+            modalTitle.value += ' 系统生成跟踪代码';
             modalGtmStatus.value = false;
             modalManualAddGTMStatus.value = false;
             modalSysAddGTMStatus.value = true;
@@ -111,21 +126,24 @@
             googleGtmForm.body = res.result.gtmBody;
           } else {
             modalVisible.value = true;
-            modalTitle.value = '添加跟踪代码';
+            modalTitle.value += ' 添加跟踪代码';
             modalGtmStatus.value = true;
             modalManualAddGTMStatus.value = false;
             modalSysAddGTMStatus.value = false;
             okBtnStatus.value = false;
           }
         } else if (res.code == 102) {
-          message.warning('该网站已分配GA账号，不可生成跟踪代码！');
+          createMessage.warning('该网站已分配GA账号，不可生成跟踪代码！');
         } else {
-          message.error('系统异常，请重试!');
+          createMessage.error('系统异常，请重试!');
         }
+
+        spinning.value = false;
       })
       .catch(function (err) {
         cleanAllFormData();
-        message.error('网络超时，请重试!');
+        createMessage.error('网络超时，请重试!' + err.message());
+        spinning.value = false;
       });
   }
 
@@ -154,30 +172,23 @@
   }
 
   function addGTMBySys() {
-    let that = this;
     modalVisible.value = false;
     modalTitle.value = '';
     modalGtmStatus.value = false;
     modalManualAddGTMStatus.value = false;
     modalSysAddGTMStatus.value = false;
-    let r = siteInfo;
-    tableLoading = true;
-    tableLoadingTip = '正在生成网站跟踪代码';
+
     let params = {
-      siteId: r.id,
-      domain: r.domain,
-      domainName: r.name,
-      siteCert: r.siteCert,
-      sitePrivkey: r.sitePrivkey,
-      siteChain: r.siteChain,
+      siteCode: siteInfo.code,
+      domain: siteInfo.domain,
+      domainName: siteInfo.name,
     };
-    let gtmAddUrl = `${url.gtmAddUrl}`;
-    postAction(gtmAddUrl, Qs.stringify(params), 1000 * 60 * 5)
+    let gtmAddUrl = `/gtm/add`;
+    spinning.value = true;
+    postActionForm(gtmAddUrl, params, 300000)
       .then(function (res) {
-        tableLoading = false;
-        tableLoadingTip = '';
         if (res.code == 200) {
-          $message.success('跟踪代码已生成并已添加至网站，请重新发布网站，查看跟踪代码安装情况！');
+          createMessage.success('跟踪代码已生成并已添加至网站，请重新发布网站，查看跟踪代码安装情况！');
           modalVisible.value = true;
           modalTitle.value = 'GTM网站跟踪代码';
           modalGtmStatus.value = false;
@@ -185,19 +196,16 @@
           modalManualAddGTMStatus.value = false;
           googleGtmForm.head = res.data.gtmHead;
           googleGtmForm.body = res.data.gtmBody;
-          loadingDrawerBtn = false;
         } else if (res.code == 102) {
-          loadingDrawerBtn = false;
-          $message.warning('该网站已分配GA账号，不可生成跟踪代码！');
+          createMessage.warning('该网站已分配GA账号，不可生成跟踪代码！');
         } else {
-          loadingDrawerBtn = false;
-          $message.error('网站跟踪代码生成失败！');
+          createMessage.error('网站跟踪代码生成失败！');
         }
+
+        spinning.value = false;
       })
       .catch(function () {
-        loadingDrawerBtn = false;
-        $message.error('网络超时，请重试!');
-        loadData();
+        createMessage.error('网络超时，请重试!');
       });
   }