组件样式调整

src/views/adweb/data/trafficAnalysis.vue

@@ -3,15 +3,17 @@
     <!-- 站点选择和时间筛选 -->
     <a-row class="r1">
       <a-col :span="6">
-        <span class="t1">站点：</span>
-        <select-site @comMethods="changeSite" selectWidth="300px" />
+        <div class="choose-site">
+          <span class="t1">站点：</span>
+          <select-site @set-site-info="changeSite" select-width="100%" />
+        </div>
       </a-col>
-      <a-col :span="6">
+      <a-col :span="8">
         <span class="t1">统计时间：</span>
         <a-range-picker @change="onChangeDatePciker" :disabledDate="disabledDate" :value="rangeDate"
                         style="width:70%" />
       </a-col>
-      <a-col :span="12">
+      <a-col :span="10">
         <a-button :class="queryParam.dateType == '' ? 'active' : ''" @click="setTime('')">全部时间
         </a-button>
         <a-button :class="queryParam.dateType == 'thirtyDay' ? 'active' : ''"
@@ -252,8 +254,6 @@ import { getAction } from "@/api/manage/manage";
 import moment from "moment";
 import MapAdweb from "@/components/chart/mapAdweb.vue";
 
-const siteList = ref([]);
-const selectSiteInfo = ref({});
 const queryParam = reactive<any>({});
 queryParam.limit = 10;
 queryParam.siteCode = localStorage.getItem("siteCode");
@@ -376,11 +376,8 @@ const mostAccessColumns = ref([
   // },
 ]);
 
-function changeSite(value, e) {
-  console.log(value, e)
-  selectSiteInfo.value = e.info;
-  console.log(selectSiteInfo.value)
-  queryParam.siteCode = selectSiteInfo.value.code;
+function changeSite(selectedSiteInfo: any) {
+  queryParam.siteCode = selectedSiteInfo.code;
   localStorage.setItem("siteCode", queryParam.siteCode);
   reloadData();
 }
@@ -548,13 +545,13 @@ const setTime = (time) => {
 };
 
 // 监听queryParam的变化，当它变化时重新加载数据
-watch(queryParam, (newValue, oldValue) => {
-  reloadData();
-});
+// watch(queryParam, (newValue, oldValue) => {
+//   reloadData();
+// });
 
-onMounted(() => {
-  reloadData();
-});
+// onMounted(() => {
+//   reloadData();
+// });
 </script>
 
 <style lang="less" scoped>
@@ -598,32 +595,19 @@ onMounted(() => {
 
 .r1 {
   margin: 20px;
-  display: flex;
-
-  /deep/ .ant-select-selection {
-    background: transparent;
-  }
-
-  /deep/ .ant-select-selection__clear {
-    background: transparent;
-  }
-
-  /deep/ i, /deep/ .ant-calendar-range-picker-separator {
+  .choose-site {
+    display: flex;
   }
 
-
   .t1 {
     font-size: 18px;
   }
 
   .ant-calendar-picker {
     margin-right: 20px;
-
-    /deep/ .ant-input {
-      background: transparent;
-    }
   }
 
+
   /deep/ .ant-btn {
     background: transparent;
     margin-right: 10px;

src/views/adweb/keywords/SeoKeywordsList.vue

@@ -2,10 +2,12 @@
   <div>
     <!-- 查询区域 -->
     <div class="table-page-search-wrapper">
-      <a-row :gutter="8" class="r1">
-        <a-col span="8">
-          <span class="t1">站点：</span>
-          <select-site @comMethods="changeSite" />
+      <a-row class="r1">
+        <a-col :span="8">
+          <div class="choose-site">
+            <span class="t1">站点：</span>
+            <select-site @set-site-info="changeSite" select-width="100%"/>
+          </div>
         </a-col>
         <!--          <a-col span="8">-->
         <!--            <span class="t1">套餐：</span>-->
@@ -120,11 +122,10 @@ import { useListPage } from "/@/hooks/system/useListPage";
 import SeoKeywordsModal from "./components/SeoKeywordsModal.vue";
 import { columns, searchFormSchema, superQuerySchema } from "./SeoKeywords.data";
 import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from "./SeoKeywords.api";
-import { getAllSites } from "@/views/adweb/seo/SeoKeywordsRank.api";
 import SelectSite from "@/components/Adweb/selectSite.vue";
 
 const queryParam = reactive<any>({});
-queryParam.siteCode = localStorage.getItem("siteCode");
+queryParam.siteCode = localStorage.getItem('siteCode')!;
 //注册model
 const [registerModal, { openModal }] = useModal();
 //注册table数据
@@ -163,12 +164,6 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
 
 const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;
 
-const siteinfo = ref([]);
-
-const selectSiteInfo = ref({});
-
-const planList = ref([]);
-
 /**
  * 新增事件
  */
@@ -278,103 +273,30 @@ function onchange($event, id) {
 }
 
 //切换站点
-function changeSite(value, e) {
-  getSiteInfo();
-  selectSiteInfo.value = e.info;
-  // siteCode.value = value
-  // keywords.value = ''
-  queryParam.siteCode = e.info.code;
-  console.log(e.info.code);
-  localStorage.setItem("siteCode", e.info.code);
-  getSiteInfo();
-  handleSuccess();
-}
-
-//先执行获取site信息，只有在获取到siteCode之后，才能执行以下方法
-function getSiteInfo() {
-  getAllSites().then((res) => {
-    siteinfo.value = res;
-    if (res.length > 0) {
-      let isInSite = false;
-      for (let i in res) {
-        if (localStorage.getItem("siteCode") !== null && res[i].code === localStorage.getItem("siteCode")) {
-          isInSite = true;
-          selectSiteInfo.value = res[i];
-        }
-      }
-      if (localStorage.getItem("siteCode") !== null && isInSite) {
-        // siteCode.value = localStorage.getItem('siteCode')
-      } else {
-        // siteCode.value = res[0].code
-        selectSiteInfo.value = res[0];
-        localStorage.setItem("siteCode", res[0].code);
-      }
-    }
-  });
+function changeSite(selectedSiteInfo: any) {
+  queryParam.siteCode = selectedSiteInfo.code;
+  handleSuccess()
 }
 
 //下载模板
 function downloadTemplate() {
   return window.open("/adwebv21/uploadDemo/关键词导入模版表.xlsx", "_self");
 }
-
-const marketPlanInfo = ref({
-  "domain": "",
-  "htyStatus": 0
-});
-
-const changeSeoPlans = () => {
-  // 站点套餐切换函数
-  for (let i = 0; i < planList.value.length; i++) {
-    if (planList[i].subscriptionId === queryParam.subscriptionId) {
-      planList[i].domain = marketPlanInfo.value.domain;
-      marketPlanInfo.value = planList[i];
-      break;
-    }
-  }
-};
 </script>
 
 <style scoped>
-:deep(.ant-picker), :deep(.ant-input-number) {
-  width: 100%;
-}
-
 .r1 {
   margin: 20px;
-  display: flex;
-
-  /deep/ .ant-select-selection {
-    background: transparent;
-  }
-
-  /deep/ .ant-select-selection__clear {
-    background: transparent;
-  }
-
-  /deep/ i, /deep/ .ant-calendar-range-picker-separator {
+  .choose-site {
+    display: flex;
   }
 
-
   .t1 {
     font-size: 18px;
   }
 
   .ant-calendar-picker {
     margin-right: 20px;
-
-    /deep/ .ant-input {
-      background: transparent;
-    }
-  }
-
-  /deep/ .ant-btn {
-    background: transparent;
-    margin-right: 10px;
-
-    &.active {
-      color: @primary-color;
-    }
   }
 }
 </style>